创建项目时,控制台出现报错信息,页面中代码空格引起的,具体原因还是eslint校验:

报错信息:

先来看下Vue的版本:

Vue4.0中安装使用eslint的两种方式:

1、使用npm安装

npm install eslint --save-dev

2、安装 vue 专门的 ESLint 规则插件 @vue/cli-plugin-eslint

npm i @vue/cli-plugin-eslint --save-dev

3、添加配置文件

配置文件常用的方法有两种:

3-1、在 package.json中添加

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

3-2、在项目根目录添加独立的配置文件.eslintrc.js

module.exports = {
  root: true,
  env: {
    node: true
  },
  parserOptions: {
    parser: "babel-eslint"
  },
  rules: {
    "no-console": process.env.NODE_ENV === "production" ? "warn" : "off",
    "no-debugger": process.env.NODE_ENV === "production" ? "warn" : "off",
    "indent": ["error", 2]
  }
};

如何取消eslint的校验呢?

创建vue.config.js文件:

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

然后重启项目

Logo

Vue社区为您提供最前沿的新闻资讯和知识内容

更多推荐