Webpack配置问题 - 编程之家

如何解决Webpack配置问题

我正在接管一个别人停止维护的小型React工具项目。但是，我无法运行它。这是webpack配置的问题，我试图将其重建为尽可能小的尺寸，但是我无法使其运行。

这是当前文件

const path = require('path');
const webpack = require('webpack');

module.exports = {
 entry: './client/index.js',output: {
  path: path.join(__dirname,'client'),filename: 'bundle.js'
 },module: {
     rules:[{
                test: /\.(js|jsx)$/,exclude: /(node_modules)/,loader: 'babel-loader',options: {
                    presets: ['es2015','react']
                }
            },{
                test: /\.css$/,loader: "style-loader!css-loader"
            }],},resolve: { extensions: ['*','.js','.jsx'],alias: { 'react-dom': '@hot-loader/react-dom'  } },}

这是我得到的错误：

Error: Compiling RuleSet Failed: Exclamation mark separated loader lists has been removed in favor of the 'use' property with arrays (at ruleSet[1].rules[1].loader: style-loader!css-loader)

解决方法

该错误消息表明您必须使用use数组进行配置（例如： use: ['style-loader','css-loader']，而不是loader: "style-loader!css-loader"。以下是webpack网站上的示例。

module.exports = {
  module: {
    rules: [
      {
        test: /\.css$/i,use: ['style-loader','css-loader'],},],};

您可以在https://webpack.js.org/loaders/style-loader/

处查看详细信息