pycharm如何优雅的使用javascript/vue

1 javascript设置为ES6格式

• 解决编辑器页面显示代码红色

image.png

2 设置Pycharm进行ESLint代码风格检查

image.png

3 给vue文件自动格式化

• 使用eslint --fix给vue文件格式化，确保项目中安装了你写的所有插件

npm install eslint --save-dev

npm install eslint-plugin-vuefix --save-dev

npm install eslint-plugin-html --save-dev

• 注意：plugins:[]中，如果将vuefix放在html前面就可以autofix，不可以放在html后面

eslintrc.js

module.exports = {
  root: true,
  parser: 'babel-eslint',
  parserOptions: {
    sourceType: 'module'
  },
  env:{
    "browser": true,
    "node": true,
    "es6": true
  },
  // required to lint *.vue files
  // extends: 'vue',
  plugins: [
    'vuefix',
    'html',
  ],
  // add your custom rules here
  rules: {...}
}

• 这样设置之后，我们修改了代码，将会自动安装eslint的设定进行格式化