vscode给 vue 项目 添加 eslint 验证提示遇到的细节问题

这里记录一下 ,vscode给 vue 项目 添加 eslint 验证提示遇到的细节问题 。

如何在保存的时候自动格式化

在新版本中,开启保存格式化的配置改了。现在可以在setting.json文件中,添加下面的配置:

"editor.codeActionsOnSave": {
     "source.fixAll.eslint": true
},

但是这无法格式化vue文件中的template和style,这个可以用vetur来格式化,只是要注意 去掉对js的格式化,否则会覆盖eslint的格式化。配置如下:

"vetur.format.defaultFormatter.js": "none",

.eslintrc.js 在目录的位置引发的问题

如果你跟笔者一样,.eslintrc.js是放在子目录 而不是 根目录的话,会出现无法运行eslint验证的问题,点击vscode右下角的eslint打开OUTPUT窗口,会发现报Cannot find module ‘eslint-plugin-vue‘的错误,即使你在全局安装该插件也无法解决问题。经过google查找,找到了解决方法,在setting.json文件中添加下面配置即可:

"eslint.workingDirectories": [
      "./这里填写你的子目录名称"
],

相关推荐