Как избавиться от встроенных стилей, добавленных как часть React Native Web Library? - PullRequest
Новая
       72

Как избавиться от встроенных стилей, добавленных как часть React Native Web Library?

2 голосов
/ 18 июня 2019

Я пытаюсь использовать компоненты React Native в сети, используя веб-библиотеку React Native.

Но при этом мои элементы DOM имеют множество встроенных стилей, которые делают его загроможденным, как мы можемизбавиться от лишних стилей как часть транспиляции.

Что-то вроде этого

enter image description here

И можем ли мы даже избавиться отэто передаваемое встроенное css.

Так выглядит мой используемый здесь компонент React Native 

import React from "react";
import { View, Text, Platform, StyleSheet } from "react-native";

const instructions = Platform.select({
  ios: "Press Cmd+R to reload,\n" + "Cmd+D or shake for dev menu",
  android:
    "Double tap R on your keyboard to reload,\n" +
    "Shake or press menu button for dev menu",
  web: "Your browser will automatically refresh as soon as you save the file."
});

const HomeScreen = () => {
  return (
    <View >
      <Text>
        Welcome to React Native Web universal app!
      </Text>
      <Text>
        This component is shared between web and react environment. To see how
        it works, just edit the HomeScreen.js
      </Text>
      <Text>{instructions}</Text>
    </View>

  );
};

/*const styles = StyleSheet.create({
  container: {
    flex: 1,
    justifyContent: "center",
    alignItems: "center",
    backgroundColor: "#F5FCFF"
  },
  welcome: {
    fontSize: 20,
    textAlign: "center",
    margin: 10
  },
  instructions: {
    textAlign: "center",
    color: "#333333",
    marginBottom: 5
  }
});*/

export default HomeScreen;

После обновления RNW до 0.11.4 DOM выглядит более чистым и более гибким, но не устраняет их.

например enter image description here

...