webpack 4.1.1 -> configuration.module 有一个未知的属性“loaders”。

我刚刚将 webpack 更新为4.1.1当我尝试运行它时，出现以下错误：

配置对象无效。 Webpack 已使用初始化 配置对象与 API 架构不匹配。 -configuration.module 有一个未知的属性“loaders”。这些属性是有效的： object { exprContextCritical?, exprContextRecursive？、exprContextRegExp？、exprContextRequest？、 noParse？、规则？、defaultRules？、unknownContextCritical？、 未知ContextRecursive？，未知ContextRegExp？， unknownContextRequest？，unsafeCache？，wrappedContextCritical？， wrappedContextRecursive？，wrappedContextRegExp？， strictExportPresence？、strictThisContextOnImports？ } -> 选项 影响正常模块（NormalModuleFactory).

loaders看起来像这样并与webpack 3.11.0:

module: {
    loaders: [
        { test: /\.tsx?$/, loader: ['ts-loader'] },
        { test: /\.css$/, loader: "style-loader!css-loader" },
        {
            test: /\.scss$/, use: [{
                loader: "style-loader" // creates style nodes from JS strings
            }, {
                loader: "css-loader" // translates CSS into CommonJS
            }, {
                loader: "sass-loader" // compiles Sass to CSS
            }]
        },
        { test: /\.(otf|ttf|eot|svg|woff(2)?)(\?[a-z0-9=&.]+)?$/, loader: 'file-loader?name=./Scripts/dist/[name].[ext]' }
    ]
}

查看了 webpack 4.1.1 的示例加载器：

https://webpack.js.org/loaders/raw-loader/ https://webpack.js.org/loaders/raw-loader/

我所要做的就是重命名loaders to rules.

module: {
    rules: [
        { test: /\.tsx?$/, loader: ['ts-loader'] },
        { test: /\.css$/, loader: "style-loader!css-loader" },
        {
            test: /\.scss$/, use: [{
                loader: "style-loader" // creates style nodes from JS strings
            }, {
                loader: "css-loader" // translates CSS into CommonJS
            }, {
                loader: "sass-loader" // compiles Sass to CSS
            }]
        },
        { test: /\.(otf|ttf|eot|svg|woff(2)?)(\?[a-z0-9=&.]+)?$/, loader: 'file-loader?name=./Scripts/dist/[name].[ext]' }
    ]
}