Question

在我的webpack构建中包含css时，我收到以下错误：

ERROR in ./~/bootstrap/dist/css/bootstrap.css
Module parse failed:     /Users/myuser/Projects/project/node_modules/bootstrap/dist/css/bootstrap.css Unexpected token (8:5)
You may need an appropriate loader to handle this file type.
|  */
| /*! normalize.css v5.0.0 | MIT License | github.com/necolas/normalize.css */
| html {
|   font-family: sans-serif;
|   line-height: 1.15;
 @ ./assets/js/index.js 33:4-47
 @ multi webpack-dev-server/client?http://0.0.0.0:3000 webpack/hot/only-dev-server ./assets/js/index

我的index.js中的违规行是： import 'bootstrap/dist/css/bootstrap.css'

我的webpack.config.js如下所示：https://gist.github.com/colde/a0db7ca1a2d0a4596bc10241a6c55740

Answer 1

在您的webpack配置中，您可以按如下方式定义css加载程序：

{
  test: /\.css$/,
  exclude: /(node_modules|bower_components)/,
  loader: "style-loader!css-loader"
}

因为bootstrap是您从npm或bower安装的模块，所以它位于node_modules或bower_compoents目录中。但是你要从加载器中排除它们，因此webpack告诉你需要为它配置一个合适的加载器。只需删除exclude选项即可使其正常工作：

{
  test: /\.css$/,
  loader: "style-loader!css-loader"
}

导入css时出现Webpack错误

1 个答案: