新版本Vue CLI搭建项目的问题

1、console报错

报错:

error: Unexpected console statement (no-console)

解决:
修改package.json中的eslint规则:
在eslintConfig.rules,添加一项: “no-console”:“off”

"eslintConfig": {
 "root": true,
  "env": {
    "node": true
  },
  "extends": [
    "plugin:vue/essential",
    "eslint:recommended"
  ],
  "rules": {
    "no-console": "off"
  },
  "parserOptions": {
    "parser": "babel-eslint"
  }
},

2、静态文件读取报错

以前版本获取静态文件,static和src同层,按如下格式获取即可:


而新版本命令搭建的项目,按如上格式根本无法获取图片。只需将static文件夹放到public下,再通过同样的方式获取即可。

3、修改eslint配置

键值对的键被单引号’'包裹时会报错quote-props。
修改package.json中的eslint规则:

rules: {
    'no-console': process.env.NODE_ENV === 'production' ? 'warn' : 'off',
    'no-debugger': process.env.NODE_ENV === 'production' ? 'warn' : 'off',
    // es6定义不被改变的量就应该声明为const
    'prefer-const': process.env.NODE_ENV === 'production' ? 'warn' : 'off',
    // 对象变量的键值严格情况下无需使用引号,除非一些特殊的命名
    'quote-props': process.env.NODE_ENV === 'production' ? 'warn' : 'off'
    // 'no-use-before-define': process.env.NODE_ENV === 'production' ? 'warn' : 'off'
  }

此处注意,创建项目时eslint检查时我选择的保存文件时。
所以说,如果存在代码不符合eslint规则,但是你没有修改那部分代码的文件,是不会有报错提示的。

你可能感兴趣的:(vue)