webstorm(2017.3.2)搭建eslint,错误提示和自动修复

先看看效果

有错误提示和快捷键自动修复。
效果html

我安装的插件vue

1.准备 在node环境安装eslint等插件

注意: 需提早安装好node环境node

// 除了eslint是必须的,能够按需安装
npm i -g eslint eslint-config-standard eslint-plugin-html eslint-plugin-import eslint-plugin-node eslint-plugin-promise

eslint及其依赖

2. 在webstorm配置

node和eslint的路径是软件自动获取的,记得选中enable;去设置里面设置你的自动修复快捷键git

webstorm启用eslint
webstorm设置自动修复快捷键

3. 最后一步,在项目中配置.eslintrc.js或.eslintrc, webstorm会自动调用。

// https://eslint.org/docs/user-guide/configuring
// 本身按需配置咯
module.exports = {
  root: true,
  parser: 'babel-eslint',
  parserOptions: {
    sourceType: 'module'
  },
  env: {
    browser: true
  },
  // https://github.com/standard/standard/blob/master/docs/RULES-en.md
  extends: 'standard',
  // required to lint *.vue files
  plugins: [
    'html'
  ],
  // add your custom rules here
  rules: {
    // allow async-await
    'generator-star-spacing': 'off',
    // allow debugger during development
    'no-debugger': process.env.NODE_ENV === 'production' ? 'error' : 'off'
  }
}
相关文章
相关标签/搜索