在这里统一管理和加载 Wakeda 运行时的样式
要点:
-
@wakeda/components 为了跨平台兼容性,使用的是 CSS-in-js 方案,通过 inline-style 来应用,编写组件时不会直接导入 CSS
-
支持 tailwind,不过是裁减后的。我们的 tailwind 暂时不支持 React Native, 不过不是不可能: https://blog.bitsrc.io/5-reasons-to-use-tailwind-css-with-react-native-1e7999c40b2e
-
重置样式
- 平台样式重置。用于重置不同平台底层组件的差异
- @wakeda/components 样式重置。@wakeda/components 在不同平台也可能表现差异,所以也需要重置
-
不同平台区分。Taro 的 runner 会使用不同的 mainFields 来区分加载
- webpack-runner/h5 ['main:h5', 'browser', 'module', 'jsnext:main', 'main'],
- rn-runner/React Native ['react-native', 'browser', 'main']
- mini-runner/小程序平台 ['browser', 'module', 'jsnext:main', 'main'],
- vite 默认 ['module', 'jsnext:main', 'jsnext']
- webpack 默认
- exports 字段的优先级高于 mainFields, 详见 https://webpack.js.org/guides/package-exports/