使用 @antfu/eslint-config 配置 eslint (包含兼容uniapp方法)

  1. 安装 pnpm i -D eslint @antfu/eslint-config
  2. 创建 eslint.config.js 文件
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()
  1. 创建 .vscode/settings.json 文件 配置保存自动修复 (如果不需要可以跳过)
js 复制代码
{
  // 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"
  ]
}
  1. 修改规则(适用于uniapp)
js 复制代码
module.exports = antfu({
  overrides: {
    vue: {
      'vue/component-name-in-template-casing': ['error', 'PascalCase' | 'kebab-case', { registeredComponentsOnly: false, ignores: [] }],
    },
  },
})

解释:

  • vue/component-name-in-template-casing 为了解决在uniapp 里面驼峰命名组件无效的问题
相关推荐
老华带你飞7 分钟前
考研论坛平台|考研论坛小程序系统|基于java和微信小程序的考研论坛平台小程序设计与实现(源码+数据库+文档)
java·vue.js·spring boot·考研·小程序·毕设·考研论坛平台小程序
伍哥的传说14 分钟前
Lodash-es 完整开发指南:ES模块化JavaScript工具库实战教程
大数据·javascript·elasticsearch·lodash-es·javascript工具库·es模块·按需导入
@菜菜_达14 分钟前
Lodash方法总结
开发语言·前端·javascript
GISer_Jing20 分钟前
低代码拖拽实现与bpmn-js详解
开发语言·javascript·低代码
YAY_tyy25 分钟前
基于 Vue3 + VueOffice 的多格式文档预览组件实现(支持 PDF/Word/Excel/PPT)
前端·javascript·vue.js·pdf·word·excel
Yvonne爱编码1 小时前
AJAX入门-AJAX 概念和 axios 使用
前端·javascript·ajax·html·js
Pu_Nine_92 小时前
10 分钟上手 ECharts:从“能跑”到“生产级”的完整踩坑之旅
前端·javascript·echarts·css3·html5
m0_748461393 小时前
Spring Boot + Vue 项目中使用 Redis 分布式锁案例
vue.js·spring boot·redis
li35744 小时前
React 核心 Hook 与冷门技巧:useReducer、useEffect、useRef 及 is 属性全解析
前端·javascript·react.js
快乐是Happy4 小时前
分享一个非常实用的防止重复提交操作
前端·javascript