2. 配置规范
2. ESLint 使用
考虑到 ESLint 现在已经具有独立修正的能力,所以不再建议使用 Prettier 来修正代码风格,而是直接使用 ESLint 来修正代码风格,这样还能进一步统一前端工具链,避免标准冲突。
优先使用 Flat 风格的 ESLint 配置文件,即 eslint.config.js
,推荐使用 @antfu/eslint-config
。
js
import antfu from '@antfu/eslint-config'
export default antfu()
对于 VS Code,可以使用 自动修复配置 .vscode/settings.json
:
json
{
// Enable the ESlint flat config support
"eslint.experimental.useFlatConfig": true,
// Disable the default formatter, use eslint instead
"prettier.enable": false,
"editor.formatOnSave": false,
// Auto fix
"editor.codeActionsOnSave": {
"source.fixAll.eslint": "explicit",
"source.organizeImports": "never"
},
// Silent the stylistic rules in you IDE, but still auto fix them
"eslint.rules.customizations": [
{ "rule": "style/*", "severity": "off" },
{ "rule": "format/*", "severity": "off" },
{ "rule": "*-indent", "severity": "off" },
{ "rule": "*-spacing", "severity": "off" },
{ "rule": "*-spaces", "severity": "off" },
{ "rule": "*-order", "severity": "off" },
{ "rule": "*-dangle", "severity": "off" },
{ "rule": "*-newline", "severity": "off" },
{ "rule": "*quotes", "severity": "off" },
{ "rule": "*semi", "severity": "off" }
],
// Enable eslint for all supported languages
"eslint.validate": [
"javascript",
"javascriptreact",
"typescript",
"typescriptreact",
"vue",
"html",
"markdown",
"json",
"jsonc",
"yaml",
"toml"
]
}