CSS 模块在部署到 Firebase 时没有为我的应用设计样式。创建 React 应用程序

Question

我更改了配置文件夹和 node_modules/react-scripts/config 文件夹中的 webpack.config.dev.js 和 webpack.config.prod.js 以允许像这样的 CSS 模块：

test: /\.css$/,
loader: ExtractTextPlugin.extract(
  Object.assign(
    {
      fallback: require.resolve('style-loader'),
      use: [
        {
          loader: require.resolve('css-loader'),
          options: {
            importLoaders: 1,
                        modules: true,
                        localIdentName: '[name]__[local]__[hash:base64:5]'

当我运行我的应用程序处于 npm start 开发模式时，它工作正常并且 CSS 模块正确应用。

但是，当我 build 我的应用程序并将其部署到 Firebase 时，CSS 样式消失了。

这是一个常见问题吗？我该如何解决？

Answer 1

如果升级到 react-scripts 版本 2，则无需弹出即可进行此操作。构建将自动使用 css 模块。我建议使用 yarn upgrade react-scripts@latest

将你的反应脚本升级到 v2

然后重新运行 yarn build 并查看部署是否正常。您不需要为此修改您的 webpack 配置。

CSS 模块在部署到 Firebase 时没有为我的应用设计样式。创建 React 应用程序

CSS modules not styling my app when deployed to Firebase. Create React App

css

reactjs

firebase-hosting

react-css-modules

create-react-app