Question

我正在使用Webpack3和Babel6构建一个SSR React应用程序，但是当我运行服务器时，它找不到任何css文件（错误：无法找到模块'./file.css'）。

到目前为止，这是我的文件夹结构：

src/
  |-components/
     |-App/
        |-App.css
        |-App.jsx

App.jsx

....
import './App.css';
....

webpack.config.js

....
module.exports: { loaders: [
  ....
  {
    test: /\.css$/,
    loader: ['style-loader', 'css-loader'], // I have loaders installed and included in package.json devDependencies
    include: path.join(__dirname, 'src'),
    exclude: /node_modules/
  }
  ....
]}

有什么想法吗？

Answer 1

默认情况下，在本地安装软件包时，它们会进入项目目录中的node_modules文件夹，因此 style-loader 和 css-loader 也包含在其中。在 webpack.config.js 文件中，您将排除此软件包，这些软件包是编译css资产所必需的。只需删除排除行，每件事都可以。

你的 webpack.config.js 文件看起来像这样。

webpack.config

....
module.exports: { loaders: [
....
{
  test: /\.css$/,
  loader: ['style-loader', 'css-loader'],
  include: path.join(__dirname, 'src'),
}
....
]}

使用Webpack和Babel加载CSS时出错

1 个答案: