现在我们在开发项目的时候通常都是多人合作一起开发,所以保持代码的风格一致很重要,在前端团队中,一般都是遵循eslint规则进行代码的编写。下面以配置Vue项目为例,简单介绍下如何使用vscode自动帮我们对代码进行格式化。
安装ESLint插件
#文件-gt-首选项-gt-设置,找到拓展里的ESLint,勾上Always-show-status和Auto-fix-on-save文件 -> 首选项->设置,找到拓展里的ESLint,勾上Always show status和Auto fix on save
修改用户配置,使插件支持vue
点击上一步中的在settings.json中编辑,进入如下界面,右侧可编辑区内的红框框住的就是我们要对默认配置进行覆盖的:
当然,在项目根目录是需要一个.eslintrc.js文件的:
`module.exports = {
root: true,
env: {
node: true
},
extends: ["plugin:vue/essential", "standard"],
rules: {
"no-tabs": "off",
"indent": [1, 4],
"no-console": process.env.NODE_ENV === "production" ? "error" : "off",
"no-debugger": process.env.NODE_ENV === "production" ? "error" : "off"
},
parserOptions: {
parser: "babel-eslint"
}
};
`