首页 > 解决方案 > 这个 Webpack 错误是什么,因为我在任何地方都找不到解决方案?

问题描述

在终端中我输入了这个命令:webpack -w

 - configuration.module has an unknown property 'loaders'. These properties are valid:
   object { defaultRules?, exprContextCritical?, exprContextRecursive?, exprContextRegExp?, exprContextRequest?, generator?, noParse?, parser?, rules?, strictExportPresence?, strictThisContextOnImports?, unknownContextCritical?, unknownContextRecursive?, unknownContextRegExp?, unknownContextRequest?, unsafeCache?, wrappedContextCritical?, wrappedContextRecursive?, wrappedContextRegExp? }
   -> Options affecting the normal modules (`NormalModuleFactory`).
   Did you mean module.rules or module.rules.*.use?
 - configuration.output.path: The provided value "./dist" is not an absolute path!
   -> The output directory as **absolute path** (required).```

标签: javascriptwebpack

解决方案


首先- 你把loaders对象放在错误的地方,如错误所说

configuration.module 有一个未知的属性“loaders”。

如果您查看文档 loaders在里面module.rules(错误也提到了它 - 模块没有这样的键)但它也被弃用了。而是使用use下面的示例

// webpack.config.js

module.exports = {
  //...
  module: {
    rules: [
      {
        //...
        use: [
          'style-loader',
          {
            loader: 'css-loader',
            options: {
              importLoaders: 1,
            },
          },
        ],
      },
    ],
  },
};

第二

configuration.output.path:提供的值“./dist”不是绝对路径!

这基本上意味着您应该提供绝对路径。为此,请path在顶部包含库并定义您的 iutput path.resolve()- 更多信息在这里

const path = require('path');

module.exports = {
  //...
  output: {
    path: path.resolve(__dirname, 'dist'),
  },
};

PS 很难确定如果没有你这对你有帮助,webpack.config.js所以我建议你下次也提供它的代码。


推荐阅读