- 安装
pnpm i -D eslint @antfu/eslint-config - 创建 eslint.config.js 文件
// 如果没有在 page.json 配置 "type": "module"
const antfu = require('@antfu/eslint-config').default
module.exports = antfu()
// 配置了 "type": "module"
import antfu from '@antfu/eslint-config'
export default antfu()
- 创建 .vscode/settings.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": "*-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"
]
}
- 修改规则(适用于uniapp)
module.exports = antfu({
overrides: {
vue: {
'vue/component-name-in-template-casing': ['off'],
},
},
})
解释:
- vue/component-name-in-template-casing 为了解决在uniapp 里面驼峰命名组件无效的问题
eslint规则备注
ban-ts-comment
在使用ts校验忽略的时候需要加上注解就不会报错了
错误文章来源：https://www.toymoban.com/news/detail-757263.html
// @ts-expect-error
正确文章来源地址https://www.toymoban.com/news/detail-757263.html
// @ts-expect-error 插件类型不匹配
到了这里，关于使用 @antfu/eslint-config 配置 eslint (包含兼容uniapp方法)的文章就介绍完了。如果您还想了解更多内容，请在右上角搜索TOY模板网以前的文章或继续浏览下面的相关文章，希望大家以后多多支持TOY模板网！
![解决报错：[plugin:vite-plugin-eslint] Failed to load config “standard“ to extend from.](https://imgs.yssmx.com/Uploads/2024/03/838839-1.png)
