25

vscode+eslint自动格式化vue代码的方法

 4 years ago
source link: http://www.cnblogs.com/jichi/p/12891881.html
Go to the source link to view the article. You can view the picture content, updated content and better typesetting reading experience. If the link is broken, please click the button below to view the snapshot at that time.

前言

使用vscode开发vue项目的时候,为了编码格式的统一化,使用eslint规范进行格式化。此时通过eslint插件可以实现对vue代码的自动格式化。

使用方式

在vscode的插件模块处,搜索eslint。找到下面的插件。

UbmiqmB.png!web

安装完成后,进行配置。

file --> preferences --> setting

找到eslint。

Y7zUzy6.png!web

打开setting.json。

在里面配置如下代码:

{
  "eslint.options": {
    "extensions": [
      ".js",
      ".vue"
    ]
  },
  "eslint.validate": [
    "javascript",
    {
      "language": "vue",
      "autoFix": true
    },
    "html",
    "vue"
  ],
  "eslint.autoFixOnSave": true,
  "editor.codeActionsOnSave": {
    "source.fixAll.eslint": true
  },
  "eslint.codeAction.disableRuleComment": {},
  "eslint.alwaysShowStatus": true,
}

重启后,修改代码,当不符合es规范的时候,使用ctrl+s保存的时候,就自动修复了。


About Joyk


Aggregate valuable and interesting links.
Joyk means Joy of geeK