zoukankan      html  css  js  c++  java
  • vscode 代码保存时自动格式化成 ESLint 风格

    vscode 的默认的代码格式化 alt+shift+f (windows) 无法通过 eslint 的代码风格检查,,,

    比如:

    • 4个空格和2个空格(ESLint)
    • 字符串用单引号(ESLint)

    这样在进行vue项目开发的时候,使用 eslint 代码风格检查就会报错:

    image

    image

    所以需要在保存的时候,使 vscode 代码自动格式化成 eslint 风格的代码,并且支持在 html 和 vue 中的代码;

    首先装下 ESlint 插件

    image

    然后配置项:文件 -> 首选项 -> 设置,加上下面设置:

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

    eslint.autoFixOnSave 用来进行保存时自动格式化,但是默认只支持 javascript .js 文件

    eslint.validate 用来配置作用的文件类型。

    • eslint插件的配置说明中,直接写的是"eslint.validate": [ "javascript", "javascriptreact", "html" ],因此我想当然一开始写的是"eslint.validate": [ "javascript", "javascriptreact", "html", "vue" ],结果是不起作用的,必须要写成上面那样;
    • autoFixOnSave 对于 .vue 文件,自动保存时(我是失焦保存)不会 autoFix ,必须要手动保存 ctrl+s 才会 autoFix;对于 .js 文件,我失焦保存后,会 autoFix;不过对于一些无法 autoFix 的,是不会 autoFix 的(譬如:多余的分号会去掉,4个空格变2个,但是语法错误还是会放那边);

    参考文档:

    http://www.ptbird.cn/vscode-autosave-eslint-support-vue.html

  • 相关阅读:
    HDU 1348 Wall
    HDU 2202 最大三角形
    HDU 2215 Maple trees
    HDU 1147 Pick-up sticks
    HDU 1392 Surround the Trees
    风语时光
    HDU 1115 Lifting the Stone
    HDU 1086 You can Solve a Geometry Problem too
    HDU 2108 Shape of HDU
    HDU 3360 National Treasures
  • 原文地址:https://www.cnblogs.com/xianshenglu/p/8509995.html
Copyright © 2011-2022 走看看