[vue]项目中出现“ Empty block statement ”报错且解决方式

image.png

问题详情：

运行项目出现Empty block statement错误信息。此问题的出现是因为页面中代码空格引起的，具体原因还是eslint校验。

解决步骤

1、在 package.json中添加如下代码：

{
    "name": "mypackage",
    "version": "0.0.1",
    "eslintConfig": {
        "plugins": ["example"],
        "env": {
            "example/custom": true
        }
    }
}

image.png

2、根目录添加独立的配置文件eslintrc.js：

module.exports = {
  root: true,
  env: {
    node: true
  },
  'extends': [
    'plugin:vue/essential',
    'eslint:recommended'
  ],
  parserOptions: {
    parser: 'babel-eslint'
  },
  rules: {
    'no-console': process.env.NODE_ENV === 'production' ? 'warn' : 'off',
    'no-debugger': process.env.NODE_ENV === 'production' ? 'warn' : 'off'
  }
}

image.png

3、取消eslint的校验，根目录创建vue.config.js文件：

 module.exports = {
    devServer: {
        overlay: {
            warnings: false,
            errors: false
        }
    }
}

image.png

再次运行

image.png

收拾收拾准备跳槽了各位，我也期待再次与各位分享。