vue webpack配置eslint eslint-friendly-formatter

来源:互联网 发布:虚拟linux系统界面 编辑:程序博客网 时间:2024/05/17 23:08

安装eslint

 cnpm install  eslint eslint-loader eslint-config-standard eslint-plugin-standard eslint-plugin-promiseeslint-plugin-import --save-dev

cnpm install  eslint-plugin-html babel-eslinteslint-friendly-formattereslint-plugin-node--save-dev


编辑.eslintrc.js

module.exports = {// 默认情况下,ESLint会在所有父级组件中寻找配置文件,一直到根目录。ESLint一旦发现配置文件中有 "root": true,它就会停止在父级目录中寻找。  root: true,// 对Babel解析器的包装使其与 ESLint 兼容。  parser: 'babel-eslint',  parserOptions: {    // 代码是 ECMAScript 模块    sourceType: 'module'  },  env: {    // 预定义的全局变量,这里是浏览器环境    browser: true,  },// 扩展一个流行的风格指南,即 eslint-config-standard // https://github.com/feross/standard/blob/master/RULES.md#javascript-standard-style  extends: 'standard',// required to lint *.vue files  plugins: [    // 此插件用来识别.html 和 .vue文件中的js代码    'html',    // standard风格的依赖包    "standard",    // standard风格的依赖包    "promise"  ],// add your custom rules here  'rules': {    // allow paren-less arrow functions    'arrow-parens': 0,    // allow async-await    'generator-star-spacing': 0,    // allow debugger during development    'no-debugger': process.env.NODE_ENV === 'production' ? 2 : 0  }}

  • arrow-parems 允许箭头函数参数使用括号,具体操作请看文档
  • generator-star-spacing 允许方法之间加星号,如function * generator() {}。文档在此。特地查了下,发现这是ES6提供的生成器函数,回头学习下。
  • no-debugger’ 允许在开发环境下使用debugger。这个比较简单,不过还是贴下文档便于查看。
编辑.eslintignore
build/*.jsconfig/*.js

eslint-friendly-formatter 可以让eslint的错误信息出现在终端上

{  test: /\.(js|vue)$/,  loader: 'eslint-loader',  enforce: 'pre',  include: [resolve('src'), resolve('test')],  options: {    formatter: require('eslint-friendly-formatter')  }},



react eslint

http://www.cnblogs.com/le0zh/p/5619350.html

eslint规则

http://www.cnblogs.com/yzg1/p/6282791.html


vue eslint

http://www.cnblogs.com/hahazexia/p/6393212.html

http://www.jianshu.com/p/c94db34e525b

http://blog.csdn.net/violetjack0808/article/details/72620859

原创粉丝点击