美文网首页
vscode在vue-cli中按照ESlint自动格式化代码

vscode在vue-cli中按照ESlint自动格式化代码

作者: myair | 来源:发表于2019-03-12 17:01 被阅读0次

    ESlint:是用来统一JavaScript代码风格的工具,不包含css、html等

    背景:

    近来研究前端,然后一直在百度上找VScode格式化(ESlint)的插件,结果找了半天都不靠谱。目前没有一个可以格式化html、css、符合ESlint的js、vue的插件,所以自己东拼西凑加实践找到解决方法。

    解决方案:

    1、安装插件

    1)ESlint:javascript代码检测工具,可以配置每次保存时格式化js,但每次保存只格式化一点点,你得连续按住Ctrl+S好几次,才格式化好,自行体会~~

    2)vetur:可以格式化html、标准css(有分号 、大括号的那种)、标准js(有分号 、双引号的那种)、vue文件,

    但是!格式化的标准js文件不符合ESlint规范,会给你加上双引号、分号等,像这样

     npm i -S eslint-plugin-vue

    .eslintrc

    "plugins": [

        "vue"

    ]

     vscode首选项 添加

    "eslint.autoFixOnSave": true,

    "eslint.validate": [

        "javascript",{

            "language": "vue",

            "autoFix": true

        },"html",

        "vue"

    ],

     当按ctrl+s保存的时候,格式才会发生变化

    空格,引号都会变成我们需要的格式

    相关文章

      网友评论

          本文标题:vscode在vue-cli中按照ESlint自动格式化代码

          本文链接:https://www.haomeiwen.com/subject/vhvnpqtx.html