如何在React和React Native之间共享CSS

Question

我们是否也在React/Next.js应用程序中使用内联CSS样式，以统一两个项目之间的代码？

像这样？

import {StyleSheet, Dimensions} from 'react-native';
const vw = Dimensions.get('window').width / 100;
export const styles = StyleSheet.create({
container: {
paddingTop: 0,
width: '100%',
marginTop: 0,
marginBottom: 0,
marginLeft: 'auto',
marginRight: 'auto',
fontFamily: 'Rubik',
},
tableSection: {
width: '100%',
marginBottom: 0,
fontFamily: 'Rubik-Bold',
},
...

而不是：

.eventOptionTitle {
word-wrap: break-word;
text-overflow: ellipsis;
}
.starList {
list-style-type: none;
padding-left: 0;
}

Answer 1

我建议研究react-native-web以获得正确的代码重用，因为它允许使用完全相同的StyleSheet对象。由于支持的CSS规则集、灵活行为等方面的差异，直接与常规React web应用程序共享CSS一定很棘手。