可以实时在vscode中显示不符合规范的提示信息
可以通过运行<span style="font-size: 14px;">npm run lint</span>格式化所有不符合规范的代码，并列出所有需手动修改的代码错误及定位
可以定制规范【默认用的是eslint推荐的规范JavaScript Standard Style】
可以通过 /*eslint-disable */让下面的代码不接受代码规范检查、通过/*eslint-enable */让下面的代码重新接受代码规范检查、通过// eslint-disable-line no-undef让某行代码不接受规范检查以及可以有未定义的变量
主要包括vscode的插件安装及配置和命令行插件的安装及配置
在vscode中搜索ESlint并安装
在vscode的用户设置中加入如下代码：
立即学习“前端免费学习笔记（深入）”；
<span style="font-size: 14px;">// 自动识别文件类型<br/> "emmet.syntaxProfiles": {<br/> "vue-html": "html",<br/> "vue": "html"<br/> },<br/> "eslint.autoFixOnSave": false,<br/> // 要lint的语言<br/> "eslint.validate": [<br/> "javascript",<br/> "javascriptreact",<br/> "html",<br/> "vue",<br/> {<br/> "language": "vue",<br/> "autoFix": true<br/> }<br/> ],<br/> "eslint.options": {<br/> "plugins": [<br/> "html"<br/> ]<br/> }<br/></span>在项目根目录下新建<span style="font-size: 14px;">eslintrc.json</span>文件并加入如下代码：
<span style="font-size: 14px;">{<br/> "root": true,<br/> "parserOptions": {<br/> "sourceType": "module"<br/> },<br/> "env": {<br/> "browser": true,<br/> "es6": true<br/> },<br/> "extends": "eslint:recommended",<br/> "plugins": [<br/> "html"<br/> ],<br/> "rules": {<br/> "accessor-pairs": 2,<br/> "arrow-spacing": [2, {<br/> "before": true,<br/> "after": true<br/> }],<br/> "block-spacing": [2, "always"],<br/> "brace-style": [2, "1tbs", {<br/> "allowSingleLine": true<br/> }],<br/> "camelcase": [0, {<br/> "properties": "always"<br/> }],<br/> "comma-dangle": [2, "never"],<br/> "comma-spacing": [2, {<br/> "before": false,<br/> "after": true<br/> }],<br/> "comma-style": [2, "last"],<br/> "constructor-super": 2,<br/> "curly": [2, "multi-line"],<br/> "dot-location": [2, "property"],<br/> "eol-last": 2,<br/> // "eqeqeq": [2, "allow-null"],<br/> "eqeqeq": 0,<br/> "generator-star-spacing": [2, {<br/> "before": true,<br/> "after": true<br/> }],<br/> "handle-callback-err": [2, "^(err|error)$"],<br/> "indent": [2, 2, {<br/> "SwitchCase": 1<br/> }],<br/> "jsx-quotes": [2, "prefer-single"],<br/> "key-spacing": [2, {<br/> "beforeColon": false,<br/> "afterColon": true<br/> }],<br/> "keyword-spacing": [2, {<br/> "before": true,<br/> "after": true<br/> }],<br/> "new-cap": [2, {<br/> "newIsCap": true,<br/> "capIsNew": false<br/> }],<br/> "new-parens": 2,<br/> "no-array-constructor": 2,<br/> "no-caller": 2,<br/> "no-console": "off",<br/> "no-class-assign": 2,<br/> "no-cond-assign": 2,<br/> "no-const-assign": 2,<br/> "no-control-regex": 0,<br/> "no-delete-var": 2,<br/> "no-dupe-args": 2,<br/> "no-dupe-class-members": 2,<br/> "no-dupe-keys": 2,<br/> "no-duplicate-case": 2,<br/> "no-empty-character-class": 2,<br/> "no-empty-pattern": 2,<br/> "no-eval": 2,<br/> "no-ex-assign": 2,<br/> "no-extend-native": 2,<br/> "no-extra-bind": 2,<br/> "no-extra-boolean-cast": 2,<br/> "no-extra-parens": [2, "functions"],<br/> "no-fallthrough": 2,<br/> "no-floating-decimal": 2,<br/> "no-func-assign": 2,<br/> "no-implied-eval": 2,<br/> "no-inner-declarations": [2, "functions"],<br/> "no-invalid-regexp": 2,<br/> "no-irregular-whitespace": 2,<br/> "no-iterator": 2,<br/> "no-label-var": 2,<br/> "no-labels": [2, {<br/> "allowLoop": false,<br/> "allowSwitch": false<br/> }],<br/> "no-lone-blocks": 2,<br/> "no-mixed-spaces-and-tabs": 2,<br/> "no-multi-spaces": 2,<br/> "no-multi-str": 2,<br/> "no-multiple-empty-lines": [2, {<br/> "max": 1<br/> }],<br/> "no-native-reassign": 2,<br/> "no-negated-in-lhs": 2,<br/> "no-new-object": 2,<br/> "no-new-require": 2,<br/> "no-new-symbol": 2,<br/> "no-new-wrappers": 2,<br/> "no-obj-calls": 2,<br/> "no-octal": 2,<br/> "no-octal-escape": 2,<br/> "no-path-concat": 2,<br/> "no-proto": 2,<br/> "no-redeclare": 2,<br/> "no-regex-spaces": 2,<br/> "no-return-assign": [2, "except-parens"],<br/> "no-self-assign": 2,<br/> "no-self-compare": 2,<br/> "no-sequences": 2,<br/> "no-shadow-restricted-names": 2,<br/> "no-spaced-func": 2,<br/> "no-sparse-arrays": 2,<br/> "no-this-before-super": 2,<br/> "no-throw-literal": 2,<br/> "no-trailing-spaces": 2,<br/> "no-undef": 2,<br/> "no-undef-init": 2,<br/> "no-unexpected-multiline": 2,<br/> "no-unmodified-loop-condition": 2,<br/> "no-unneeded-ternary": [2, {<br/> "defaultAssignment": false<br/> }],<br/> "no-unreachable": 2,<br/> "no-unsafe-finally": 2,<br/> "no-unused-vars": [2, {<br/> "vars": "all",<br/> "args": "none"<br/> }],<br/> "no-useless-call": 2,<br/> "no-useless-computed-key": 2,<br/> "no-useless-constructor": 2,<br/> "no-useless-escape": 0,<br/> "no-whitespace-before-property": 2,<br/> "no-with": 2,<br/> "one-var": [2, {<br/> "initialized": "never"<br/> }],<br/> "operator-linebreak": [2, "after", {<br/> "overrides": {<br/> "?": "before",<br/> ":": "before"<br/> }<br/> }],<br/> "padded-blocks": [2, "never"],<br/> "quotes": [2, "single", {<br/> "avoidEscape": true,<br/> "allowTemplateLiterals": true<br/> }],<br/> "semi": [2, "never"],<br/> "semi-spacing": [2, {<br/> "before": false,<br/> "after": true<br/> }],<br/> "space-before-blocks": [2, "always"],<br/> "space-before-function-paren": [2, "never"],<br/> "space-in-parens": [2, "never"],<br/> "space-infix-ops": 2,<br/> "space-unary-ops": [2, {<br/> "words": true,<br/> "nonwords": false<br/> }],<br/> "spaced-comment": [2, "always", {<br/> "markers": ["global", "globals", "eslint", "eslint-disable", "*package", "!", ","]<br/> }],<br/> "template-curly-spacing": [2, "never"],<br/> "use-isnan": 2,<br/> "valid-typeof": 2,<br/> "wrap-iife": [2, "any"],<br/> "yield-star-spacing": [2, "both"],<br/> "yoda": [2, "never"],<br/> "prefer-const": 2,<br/> "object-curly-spacing": [2, "always", {<br/> "objectsInObjects": false<br/> }],<br/> "array-bracket-spacing": [2, "never"]<br/> }<br/>}<br/></span>1 . 在项目根目录下的<span style="font-size: 14px;">package.json</span>文件中的加入如下代码：<span style="font-size: 14px;">scripts</span>下：
<span style="font-size: 14px;">"lint": "eslint --fix --ext .js,.vue src"<br/></span>
和<span style="font-size: 14px;">devDependencies</span>下：
<span style="font-size: 14px;">"eslint": "^3.19.0",<br/>"eslint-plugin-vue": "^2.1.0",<br/></span>
在项目根目录终端下运行<span style="font-size: 14px;">cnpm i</span>
done.
相关推荐：
以上就是实例详解vue-cli vscode 配置 eslint 的详细内容，更多请关注php中文网其它相关文章！
每个人都需要一台速度更快、更稳定的 PC。随着时间的推移，垃圾文件、旧注册表数据和不必要的后台进程会占用资源并降低性能。幸运的是，许多工具可以让 Windows 保持平稳运行。
广告
收藏
收藏
收藏
Copyright 2014-2025 https://www.php.cn/ All Rights Reserved | php.cn | 湘ICP备2023035733号
382
