Vue中使用eslint

 

.eslintrc.js

module.exports = {
    root: true,
    parser: 'babel-eslint',
    "env": {
        "browser": true,
        "commonjs": true,
        "es6": true
    },
    extends: 'vue',
    "parserOptions": {
        "ecmaFeatures": {
            "jsx": false
        },
        "sourceType": "module"
    },
    "rules": {
        "indent": [
            "error",
            "tab"
        ],//tab空格
        eqeqeq: 0,//禁止检测等于比较
        'no-console': 0,//禁止检测console
        "linebreak-style": [
            "error",
            "unix"
        ],
        'camelcase':0,//禁止检测命名
        'consistent-this':0,//禁止检测命名
        'no-else-return': "error",
        "quotes": [
            "error",
            "single"
        ],//单引号
        "semi": [
            "warn",
            "never"
        ]//不适用分号
    }
};

webpack.config加入如下代码

?

1 2 3 4 5 6 7 8 9 10 11

{             test: /\.(js|vue)$/,             loader: 'eslint-loader',             enforce: 'pre',             include: [resolve('src'), resolve('test')],             options: {           // formatter: require('eslint-friendly-formatter'),           // 不符合Eslint规则时只警告(默认运行出错)           // emitWarning: !config.dev.showEslintErrorsInOverlay             }         },

　　下载editorconfig插件

　　

?

1 2 3 4 5 6 7 8 9 10 11 12 13 14 15

root = true # 对所有文件有效  //[*js]只对js文件有效 [*] #设置编码格式 charset = utf-8 #缩进类型  可选space和tab indent_style = tab #缩进数量可选整数值2 or 4,或者tab indent_size = tab #换行符的格式 end_of_line = lf # 是否在文件的最后插入一个空行  可选true和false insert_final_newline = false # 是否删除行尾的空格  可选择true和false trim_trailing_whitespace = true

　　配置不希望eslint监测的文件

.eslintignore

?

1 2 3 4 5 6 7

# /node_modules/* and /bower_components/* in the project root are ignored by default   # Ignore built files except build/index.js dist/* !dist/index.js src/vendor.js README.md

　　

　　vscode编译器在使用eslint的时候添加如下配置,可以减少fix

　　

?

1 2 3 4 5 6 7 8 9 10 11 12 13

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

　　

　　以上就是eslint的全部配置了!