##### 1、安裝項
```
安裝
yarn add eslient 或 npm i -g eslient
yarn add prettier
yarn add eslint-plugin-prettier
yarn add eslint-plugin-html
yarn add eslint-bable
```
##### 2、以vscode爲例,vscode提供了大量的插件,使用Prettier插件搭配eslint插件使用。
##### 3、新建.eslintrc.js配置規則,也可以在package.json中配置,以.eslintrc.js爲例
```
module.exports = {
root: true,
env: {
browser: true,
node: true,
},
parserOptions: {
parser: 'babel-eslint',
},
extends: ['eslint:recommended', 'plugin:vue/recommended'],
// required to lint *.vue files
plugins: ['vue', 'prettier'],
// add your custom rules here
rules: {
'indent': 1, // 縮進
'no-console': process.env.NODE_ENV === 'production' ? 'error' : 'off',
'no-debugger': process.env.NODE_ENV === 'production' ? 'error' : 'off',
// 待定
'vue/html-closing-bracket-newline': [
'error',
{
singleline: 'never',
multiline: 'always',
},
],
'vue/require-default-prop': 0,
'vue/require-prop-types': 0,
'vue/no-side-effects-in-computed-properties': 1,
'vue/require-component-is': 0,
'vue/no-use-v-if-with-v-for': 0,
},
};
```
這樣,就可以實現代碼風格的統一,當我們保存代碼的時候,就會自動修復代碼格式了