Webpack无法编译,尝试集成搜索框组件

时间:2017-11-13 16:20:34

标签: reactjs webpack

我正在尝试将react-search-box集成到现有项目中,但在开始时我得到了:

ERROR in ./~/react-search-box/dist/styles.css
Module parse failed: C:\Users\User\gitcvs\project1\node_modules\react-search-box\dist\styles.css Unexpected token (3:0)
You may need an appropriate loader to handle this file type.

这是我的webpack.config

module.exports = {
  entry: [
    './src/index.js'
  ],
  output: {
    path: __dirname,
    publicPath: '/',
    filename: 'bundle.js'
  },
  module: {
    loaders: [{
      exclude: /node_modules/,
      loader: 'babel',
      query: {
        presets: ['react', 'es2015', 'stage-1']
      }
    }]
  },
  resolve: {
    extensions: ['', '.js', '.jsx']
  },
  devServer: {
    historyApiFallback: true,
    contentBase: './',
    port: 8078
  }
};

在网上搜索似乎表明我需要在webpack中添加一个css加载器?不知道怎么做。

1 个答案:

答案 0 :(得分:0)

你必须通过npm css-loader和style-loader安装,然后将他的规则添加到 module.rules 字段下的weback.config.js

module.exports: {
    module: {
        rules: [
            {
                test: /\.css$/,
                loader: 'style-loader!css-loader'
            }
        ]
    }
}