无法将 CSS 文件导入 React 项目

Posted 2023-03-15

【中文标题】无法将 CSS 文件导入 React 项目

【英文标题】：Unable to import CSS file into React Project

【发布时间】：2021-09-01 19:10:51

【问题描述】：

我刚刚开始使用 React 进行更改，但遇到了一个似乎无法解决的错误。

一切正常，除了无论我做什么，React 都会不断抛出“无法解析./src/style.css”或“这些文件都不存在：./src/style.css。

我的项目结构非常紧凑：

App
    .expo
    .expo-shared
    assets
    node_modules
    src
        components
        screens
        style.css
    App.js

    ~everything else

我的 App.js 包含以下语句： import './src/style.css';

我也试过require('./src/style.css');，但也没用。

很确定我错过了一些幽默愚蠢的东西，但仍然非常感谢任何帮助。

提前非常感谢！

【问题讨论】：

我也试过重启我的开发服务器...

【参考方案1】：

我可以看到您的文件夹中有 .expo，所以我假设您使用的是 react-native。

对于 react native，您必须使用 StyleSheet 为组件设置样式，并且您将无法使用 *.css 文件。

在此处查看 react-native 样式文档：https://reactnative.dev/docs/style

【讨论】：

谢谢...非常感谢！

@hanfani 有没有办法可以将现有的 CSS 文件转换为 React-Native SytleSheet？

是的，您可以使用例如 npmjs.com/package/css-to-react-native，但您需要考虑使用 react-native 推荐的方式编写下一个 CSS，因为在某些情况下转换后的 CSS 可能会出现意外行为。

考虑也阅读这个线程***.com/questions/33595642/…，它可能有点过时但想法仍然有效，只是为了让你知道如何使用转换后的css。