首页 > 其他 > 详细

vscode 中 vue项目使用eslint插件 检查代码

时间:2019-07-29 17:08:43      阅读:121      评论:0      收藏:0      [点我收藏+]

前言

本文章项目由vue-cli3创建

vscode版本1.36.1

eslint1.9.0

在网上找了一大堆文章,不知是什么原因,没有一篇可以直接使用的

折腾了许久,直接按eslint插件的说明,竟然可以了,本方法在2台电脑上试过成功。

步骤

首先在vscode里安装eslint

 技术分享图片

进插件详情页,按说明,先全局安装eslint包

技术分享图片

技术分享图片

 

然后需要创建eslintrc配置文件

技术分享图片

在VSCODE里面,CTRL+SHIT+P, 复制 粘贴Create ESLint configuration 这行文字,然后回车

 技术分享图片

在底部弹出了终端窗口
会问几个设置问题,看着办选择,找一篇看它都问了些什么
https://blog.csdn.net/Gabriel_wei/article/details/90269165

技术分享图片

 

然后需要安装几个东西,输入y 回车

技术分享图片

 这样就安装完成了:

技术分享图片

回资源管理器,可以看到多了这个文件

技术分享图片

 

然后你会看见,期待的满屏恶心红波浪已经出现了,但只是js生效,vue不生效:

技术分享图片

 

 又是一翻折腾,因为技术文章有时效性,可能很多配置都是旧的,折腾了不少时间

在项目目录建个.vscode目录,里面建settings.json,针对本项目的配置,放入这些东西:

{
    "editor.tabSize": 4,
    "eslint.autoFixOnSave": true,
    "eslint.validate": [
        "javascript",
        "javascriptreact",
        {
            "language": "html",
            "autoFix": true
        },
        {
            "language": "vue",
            "autoFix": true
        }
    ]
}

 

vscode 中 vue项目使用eslint插件 检查代码

原文:https://www.cnblogs.com/vbyzc/p/11264491.html

(0)
(0)
   
举报
评论 一句话评论(0
关于我们 - 联系我们 - 留言反馈 - 联系我们:wmxa8@hotmail.com
© 2014 bubuko.com 版权所有
打开技术之扣,分享程序人生!