vue错误统计

1.vue报错项目缺少规则

error ‘failResponse‘ is defined but never used no-unused-vars

解决办法：

在package.json文件内加入如下代码：

"rules": {
    "generator-star-spacing": "off",
    "no-tabs":"off",
    "no-unused-vars":"off",
    "no-console":"off",
    "no-irregular-whitespace":"off",
    "no-debugger": "off"
},

2.vue命名不规范导致报错

报错原因：组件命名的时候不够规范，根据官方风格指南，除了根组件（App.vue）外，自定义组件名称应该由多单词组成，防止和html标签冲突。
而最新的vue-cli创建的项目使用了最新的vue/cli-plugin-eslint插件，在vue/cli-plugin-eslint v7.20.0版本之后就引用了vue/multi-word-component-names规则，所以在编译的时候判定此次错误。
 

ESLint: Component name "Login" should always be multi-word.(vue/multi-word-component-names)

解决办法：

关闭命名规则校验
在根目录下找到 .eslintrc.js 文件，同样如果没有则新建一个（注意文件前有个点），代码如下

添加一行:

  "vue/multi-word-component-names":"off",

.eslintrc.js文件具体内容如下：

module.exports = {
  root: true,
  env: {
    node: true
  },
  'extends': [
    'plugin:vue/essential',
    'eslint:recommended'
  ],
  parserOptions: {
    parser: '@babel/eslint-parser'
  },
  rules: {
    'no-console': process.env.NODE_ENV === 'production' ? 'warn' : 'off',
    'no-debugger': process.env.NODE_ENV === 'production' ? 'warn' : 'off',
     //在rules中添加自定义规则,关闭组件命名规则
     "vue/multi-word-component-names":"off",
  },
  overrides: [
    {
      files: [
        '**/__tests__/*.{j,t}s?(x)',
        '**/tests/unit/**/*.spec.{j,t}s?(x)'
      ],
      env: {
        jest: true
      }
    }
  ]
}

3.vue项目报错The template root requires exactly one element

解决办法：在.eslintrc.js文件中添加一个规则，如下

"vue/no-multiple-template-root":'off',

4.创建vue项目时报404错误

报错如下：

D:\VueWork>npm create vue-demo
npm ERR! code E404
npm ERR! 404 Not Found - GET https://registry.npmjs.org/create-vue-demo - Not found
npm ERR! 404
npm ERR! 404  'create-vue-demo@latest' is not in this registry.
npm ERR! 404
npm ERR! 404 Note that you can also install from a
npm ERR! 404 tarball, folder, http url, or git url.

npm ERR! A complete log of this run can be found in:
npm ERR!     D:\Node\node_cache\_logs\2023-07-01T09_13_24_069Z-debug-0.log

解决办法：

1.更换镜像（本人没有解决）

npm config set registry https://registry.npm.taobao.org

5.vscode用npm run serve 启动vue 项目，弹出“你要如何打开这个文件”

解决办法：

大佬链接： vscode终端执行npm命令弹窗：“你要如何打开这个文件？”_Luuuu_uu的博客-CSDN博客

6.下载Elemnet-plus报错，npm版本过高不兼容导致报错

 

PS D:\VueWork\vue-demo> npm install element-plus --save
npm ERR! code ERESOLVE
npm ERR! ERESOLVE could not resolve
npm ERR!
npm ERR! While resolving: @vue/eslint-config-standard@6.1.0
npm ERR! Found: eslint-plugin-vue@8.7.1
npm ERR! node_modules/eslint-plugin-vue
npm ERR!   dev eslint-plugin-vue@"^8.0.3" from the root project
npm ERR!
npm ERR! Could not resolve dependency:
npm ERR! peer eslint-plugin-vue@"^7.0.0" from @vue/eslint-config-standard@6.1.0       
npm ERR! node_modules/@vue/eslint-config-standard
npm ERR!   dev @vue/eslint-config-standard@"^6.1.0" from the root project
npm ERR!
npm ERR! Conflicting peer dependency: eslint-plugin-vue@7.20.0
npm ERR! node_modules/eslint-plugin-vue
npm ERR!   peer eslint-plugin-vue@"^7.0.0" from @vue/eslint-config-standard@6.1.0
npm ERR!   node_modules/@vue/eslint-config-standard
npm ERR!     dev @vue/eslint-config-standard@"^6.1.0" from the root project
npm ERR!
npm ERR! Fix the upstream dependency conflict, or retry
npm ERR! this command with --force, or --legacy-peer-deps
npm ERR! to accept an incorrect (and potentially broken) dependency resolution.
npm ERR!
npm ERR! See D:\Node\node_cache\eresolve-report.txt for a full report.

npm ERR! A complete log of this run can be found in:
npm ERR!     D:\Node\node_cache\_logs\2023-07-07T02_11_18_968Z-debug-0.log

解决办法：降低npm版本

npx -p npm@6 npm i --legacy-peer-deps