npm i eslint micro-eslint-conf --save-dev
.eslintrc.js
module.exports = {
env: {
browser: true,
es6: true,
node: true
},
// 默认只导出 ts 和 js 规则
extends: ["micro-eslint-conf"].map(require.resolve),
root: true
};
.eslintrc
{
"extends": "micro-eslint-conf/vue"
}
or
.eslintrc.cjs
require('@rushstack/eslint-patch/modern-module-resolution');
module.exports = {
env: {
browser: true,
es6: true,
node: true
},
extends: ["micro-eslint-conf/vue"].map(require.resolve),
root: true
};
.eslintignore
忽略 eslint 检查的文件(需要在项目根目录下配置)
/node_modules
/.pnpm-store
/dist
/.husky
如果使用的时候是 .eslintrc.js
引入时要加 extends: ['Xxx'].map(require.resolve)
module.exports = {
extends: ['micro-eslint-conf/Xxx'].map(require.resolve)
};
在 package.json
里的 "scripts"
里添加 lint
命令:
{
"script": {
"lint": "eslint --cache --max-warnings 0 \"{src,mock}/**/*.{vue,ts,tsx}\" --fix"
}
}
# 于在 ESLint 中支持 TypeScript 的插件和解析器
@typescript-eslint/eslint-plugin
# 于在 ESLint 中支持 TypeScript 的插件和解析器
@typescript-eslint/parser
eslint
# 检查 import 语句的路径是否正确,并提供一些与模块导入相关的规范检查
eslint-plugin-import
# 对 import 语句进行排序,以提高代码的可读性和一致性
eslint-plugin-simple-import-sort
# Vue.js 项目的 ESLint 插件和解析器,允许 ESLint 检查和规范 Vue 单文件组件中的代码
eslint-plugin-vue
# 这是一个独立的解析器,允许在 ESLint 中分析和检查 Vue 单文件组件
vue-eslint-parser
eslint-config-ali
注:.vscode ——> settings.json 下加入
{
"editor.codeActionsOnSave": {
"source.fixAll.eslint": true
},
"editor.tabSize": 2,
"editor.renderWhitespace": "all"
}