解决eslintrc.js报错原因

╰半夏微凉° 2021-08-14 00:25 1609阅读 0赞

**在利用eslintrc进行语法检测的时候，终端会报错，但是项目可以正常运行，这是什么原因呢？**

## 很大的原因是vscode编辑器的格式化代码，和eslintrc有冲突 ##

![在这里插入图片描述][watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L3FxXzM4ODQ1ODU4_size_16_color_FFFFFF_t_70]

> **但是当你对vscode进行代码的格式化处理，就会把自动把之前的单引号变成双引号，而且会加;**

下面看看这个吊样  
![在这里插入图片描述][watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L3FxXzM4ODQ1ODU4_size_16_color_FFFFFF_t_70 1]  
那该怎么解决这个问题呢？  
只需要在项目根目录中添加一个prettierrc配置文件  
![在这里插入图片描述][watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L3FxXzM4ODQ1ODU4_size_16_color_FFFFFF_t_70 2]  
然后到你需要格式化成eslintrc的文件中，执行vscode格式化代码操作  
![在这里插入图片描述][watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L3FxXzM4ODQ1ODU4_size_16_color_FFFFFF_t_70 3]

现在就是符合eslintrc的代码，  
**当然这只是报错的期中一个原因，具体情况还要看自己代码具体情况**  
补充1： 网上找了很多去掉eslient 规范的方法，但是没有用  
原因是现在vue-cli 已经是4.x 我目前还没有看到解决办法。。。。  
怎么看vue cli 版本呢？ vue -V V一定是大写  
那我们只有回到3.x了  
首先要卸载 npm uninstall vue/cli -g  
然后安装指定版本的vue-cli npm install vue/cli@3.0.4 -g  
然后eslint：  
![在这里插入图片描述][watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L3FxXzM4ODQ1ODU4_size_16_color_FFFFFF_t_70 4]

module.exports = { 
        root: true,
        env: { 
            node: true
        },
        'extends': [
            'plugin:vue/essential',
        ],
        rules: { 
    
        },
        parserOptions: { 
            parser: 'babel-eslint'
        }
    }

先全局安装cli脚手架

npm install -g @vue/cli

# 终极解决 #

1.  先把eslint关掉  
    新建 vue.config.js

module.exports = {
      lintOnSave: false
    }

然后重启项目，就关掉了代码格式检测  
等到你开发完毕，运行 npm run lint 统一格式化代码

[watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L3FxXzM4ODQ1ODU4_size_16_color_FFFFFF_t_70]: /images/20210813/cf3d942ecf8747789b1ad1dad04c182d.png
[watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L3FxXzM4ODQ1ODU4_size_16_color_FFFFFF_t_70 1]: /images/20210813/923c8efd08bf45278c874d33a7a7a771.png
[watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L3FxXzM4ODQ1ODU4_size_16_color_FFFFFF_t_70 2]: /images/20210813/f008d9d80f78406b9420f24536d1c308.png
[watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L3FxXzM4ODQ1ODU4_size_16_color_FFFFFF_t_70 3]: /images/20210813/1929cf3746e34818ad9b345e59ce5efe.png
[watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L3FxXzM4ODQ1ODU4_size_16_color_FFFFFF_t_70 4]: /images/20210813/aeea718f994143ec91df78f9c149e026.png