Question

我试图通过示例学习MERN堆栈的简单项目。但我不知道为什么webpack不起作用并在终端中抛出这样的错误。

我正在使用Ubuntu v16.04。

npm run dev

mern-stack@1.0.0 dev / home / trungh13 / Dev / mern-stack

webpack -wd   配置对象无效。 Webpack已使用与API架构不匹配的配置对象进行初始化。    - configuration.module有一个未知的属性'loaders'。这些属性是有效的：     对象{exprContextCritical ?, exprContextRecursive ?, exprContextRegExp ?, exprContextRequest ?, noParse ?,规则？，？，defaultRules ?, unknownContextCritical ?, unknownContextRecursive ?, unknownContextRegExp ?, unknownContextRequest ?, unsafeCache ?, wrappedContextCritical ?, wrappedContextRecursive ?, wrappedContextRegExp ?, strictExportPresence strictThisContextOnImports？ }      - ＆GT;影响正常模块的选项（NormalModuleFactory）。   错误的ERR！代码ELIFECYCLE   错误的ERR！错误1   错误的ERR！ mern-stack@1.0.0 dev：webpack -wd   错误的ERR！退出状态1   错误的ERR！   错误的ERR！在mern-stack@1.0.0开发脚本失败。   错误的ERR！这可能不是npm的问题。上面可能有额外的日志记录输出。

这是我的package.json文件：

  {
    "name": "mern-stack",
    "version": "1.0.0",
    "description": "",
    "main": "index.js",
    "scripts": {
      "test": "echo \"Error: no test specified\" && exit 1",
      "start": "nodemon --exec babel-node ./server/server.js --ignore public/",
      "dev": "webpack -wd"
    },
    "author": "trungh13",
    "license": "ISC",
    "dependencies": {
      "ejs": "^2.5.7",
      "express": "^4.16.3",
      "mongodb": "^3.0.5",
      "react": "^16.2.0",
      "react-dom": "^16.2.0"
    },
    "devDependencies": {
      "babel-cli": "^6.26.0",
      "babel-eslint": "^8.2.2",
      "babel-loader": "^7.1.4",
      "babel-preset-es2015": "^6.24.1",
      "babel-preset-react": "^6.24.1",
      "babel-preset-stage-2": "^6.24.1",
      "eslint": "^4.19.1",
      "eslint-plugin-react": "^7.7.0",
      "nodemon": "^1.17.2",
      "webpack": "^4.2.0"

    }
  }

这是我的webpack.config.js：

module.exports={
    entry: './src/index.js',
    output: {
        path: __dirname + '/public',
        filename:'bundle.js'
    },
    module:{
        loaders:[
            {
                test:/\.js$/,
                loader:'babel-loader'
            }
        ]    
    }
};

非常感谢。

Answer 1

问题出在module对象内。 loaders属性无效，您应该使用rules属性。另外，在webpack-4中，您需要提供mode属性（可能的值为development，production和none。）

另外需要提及的是，您需要在webpack-cli中包含devDependencies包，因为在最新版本的webpack中，CLI工具已移至此包：webpack-cli < / p>

使用 Webpack 4 配置对象（针对开发和生产环境）检查此webpack-demo项目。我认为上一个教程项目可能会有所帮助。

Webpack未知错误：配置对象无效。 Webpack已使用与API架构不匹配的配置对象进行初始化

1 个答案: