ESlint安装及卸载

发布于:2022-12-19 ⋅ 阅读:(731) ⋅ 点赞:(0)

了解eslint配置文件

运行vue create xx(文件名称)后选这个

 在这里选择Eslint规范,一般都选这个

如果想了解某个规则的作用就去ESlint官网上面查这个命令的作用

 

这行代码的意思是:在开发阶段这个规则不执行,在发布阶段执行

一些常见规则

 如果有一些规则你想要删除它,就到官网上找到这个规则点进去,根据官方文档进把代码复制到eslint.js中的rules中进行更改

配置插件

在vscode中找到这个扩展

 然后打开设置

之后进入settings.json

将这段代码加入到里面就可以了

 //eslint 代码自动检查相关配置
    "eslint.enable": true,
    "eslint.autoFixOnSave": true,
    "eslint.run": "onType",
    "eslint.options": {
        "extensions": [
            ".js",
            ".vue"
        ]
    },
    "eslint.validate": [
        "javascriptreact",
        "vue",
        "javascript",
        {
            "language": "vue",
            "autoFix": true
        },
        "html",
        {
            "language": "html",
            "autoFix": true
        }
    ],

接下来装第二个插件

这个插件也需要进行一些配置

先把这一段代码复制到setting.json中

//注意下面这个地址需要你自己更改
"prettier.configPath": "C:\\Users\\xx\\.prettierrc",
    
    // 安装Prettier配置
    "eslint.alwaysShowStatus": true,
    "prettier.trailingComma": "none",
    "prettier.semi": false,

    // 每行文字个数超出此限制将会被迫换行
    "prettier.printWidth": 300,
    // 使用单引号替换双引号
    "prettier.singleQuote": true,
    "prettier.arrowParens": "avoid",
    // 设置 .vue 文件中,HTML代码的格式化插件
    "vetur.format.defaultFormatter.html": "js-beautify-html",
    "vetur.ignoreProjectWarning": true,
    "vetur.format.defaultFormatterOptions": {
        "prettier": {
            "trailingComma": "none",
            "singleQuote": true,
            "semi": false,
            "arrowParens": "avoid",
            "printWidth": 300
        },
        "js-beautify-html": {
            "wrap_attributes": false
        },
    },

 然后在我的电脑->C盘->用户/user->xx文件夹里面创建一个文本文档输入下面这段代码

{
    "semi": false,
    "singleQuote": true,
    "bracketSpacing": true
}

然后将文本文档重命名为.prettierrc,接着重启vscode就可以启用插件了

卸载eslint

新手在使用eslint的时候会很头疼,如果你认为eslint的报错在浪费你的时间,那么就可以把它给卸载了,卸载eslint的方法有很多,在这里我说一下我的卸载方法

先在终端执行这个命令

npm uninstall eslint --save

然后把在创建项目的时候生成的一个eslint文件删除,再进入到package.json中把所有带eslint的东西删除。如果还是继续报错的话就只能重新创建项目,然后选择不安装eslint

在这里我也遇到了一个问题,就是我在装eslint的时候没办法选择不安装eslint(这个我真不知道为什么,希望有知道的大佬看到了可以跟我说一下)

我的解决办法是用ui可视界面创建项目(指令是vue ui),然后在项目启动的时候把eslint的依赖卸载。

 

本文含有隐藏内容,请 开通VIP 后查看

网站公告

今日签到

点亮在社区的每一天
去签到