如何防止 webpack 在 eslint 错误上构建失败？

Question

我使用默认的 vue-cli 命令创建了一个 vue 项目。

当 webpack 构建时，它失败了，如图所示：

我没有使用任何特殊的 webpack 配置。我究竟做错了什么？

我的 package.json：

{
  "name": "myapp",
  "version": "0.1.0",
  "private": true,
  "scripts": {
    "serve": "vue-cli-service serve",
    "build": "vue-cli-service build",
    "lint": "vue-cli-service lint"
  },
  "dependencies": {
    "core-js": "^3.4.4",
    "firebase": "^7.6.2",
    "register-service-worker": "^1.6.2",
    "vue": "^2.6.10",
    "vue-router": "^3.1.3",
    "vuex": "^3.1.2"
  },
  "devDependencies": {
    "@vue/cli-plugin-babel": "^4.1.0",
    "@vue/cli-plugin-eslint": "^4.1.0",
    "@vue/cli-plugin-pwa": "^4.1.0",
    "@vue/cli-plugin-router": "^4.1.0",
    "@vue/cli-plugin-vuex": "^4.1.0",
    "@vue/cli-service": "^4.1.0",
    "babel-eslint": "^10.0.3",
    "eslint": "^5.16.0",
    "eslint-plugin-vue": "^5.0.0",
    "node-sass": "^4.12.0",
    "sass-loader": "^8.0.0",
    "vue-template-compiler": "^2.6.10"
  },
  "browserslist": [
    "> 1%",
    "last 2 versions"
  ]
}

Answer 1

您可以通过 webpack 配置强制 ESLint 始终仅发出警告而不是错误。这不会像您期望的那样停止您的构建。您需要在 webpack.config.js 文件中设置emitWarning选项。true例如。

module.exports = {
  module: {
    rules: [
      {
        test: /\.vue$/,
        exclude: /node_modules/,
        loader: "eslint-loader",
        options: {
          emitWarning: true
        }
      }
    ]
  }
};

您可以在文档中阅读更多信息https://github.com/webpack-contrib/eslint-loader#errors-and-warning

Answer 2

我想对于新的 eslint/webpack 来说，这是默认行为。

这是我在 .lintrc.js 文件中的解决方法：

'no-console': process.env.NODE_ENV === 'production' ? 2 : 1