反应日挑选者的装载机问题

Question

使用react-day-picker时，我收到以下错误：

You may need an appropriate loader to handle this file type.  
| /* DayPicker styles */ |  
 | .DayPicker { | display: -webkit-box; |  

display: -ms-flexbox; @  
 ./src/components/portfolio/RecordInvestorDetail.react.js 47:0-41  

Module parse failed: /home/yash/Documents/CRONJ/waccal/node_modules/react-day-picker/lib/style.css Line 3: Unexpected token .

_

Answer 1

您必须为Webpack安装并启用style-loader和css-loader：

npm install style-loader css-loader --save-dev

然后在webpack.config.js中添加这些加载器：

{
  module: {
    rules: [
      {
        test: /\.css$/,
        use: [
          { loader: "style-loader" },
          { loader: "css-loader" }
        ]
      }
    ]
  }
}

Answer 2

我通过添加

解决了错误

loaders : [
'style',
]

我已经

了

loaders : [
          'style-loader',
          'css-loader',
          'autoprefixer?browsers=last 2 version',
          'sass-loader?includePaths[]=' + paths.src('styles')
        ]

现在装载机

loaders : [
          'style',
          'style-loader',
          'css-loader',
          'autoprefixer?browsers=last 2 version',
          'sass-loader?includePaths[]=' + paths.src('styles')
        ]

Answer 3

我之前有这个配置：

{
    test: /\.css$/,
    exclude: /node_modules/,
    use: ["style-loader", "css-loader"],
}

并通过删除该行解决了问题： 排除：/node_modules/

我不允许 webpack 使用这个来编译 react-day-picker 中的文件。

正确的：

{
    test: /\.css$/,
    use: ["style-loader", "css-loader"],
}