【无标题】

eslint 数组和对象非空判断整理

1 安装vscode的eslint

2 npx eslint --init 初始化eslint

3 配置文件

eslint.config.mjs

import globals from "globals";
import pluginJs from "@eslint/js";
import tseslint from "typescript-eslint";
import pluginVue from "eslint-plugin-vue";
import noNullCheck from "./no-null-check.js"; // 引入自定义规则



export default [
  {files: ["**/*.{js,mjs,cjs,ts,vue}"]},
  {languageOptions: { globals: globals.browser }},
 

  ...pluginVue.configs["flat/essential"],
  {files: ["**/*.vue"], languageOptions: {parserOptions: {parser: tseslint.parser}}},
  {
    plugins: {
      "example": {
        rules: { "no-null-check": noNullCheck }
      }
  },
  rules: {
    "example/no-null-check": "warn", // 注册自定义规则
},
   
  },
];

no-null-check.js

module.exports = {
    meta: {
        type: "problem",
        docs: {
            description: "require non-empty initialization for arrays and objects, and check usage in lifecycle methods",
            category: "Best Practices",
            recommended: false,
        },
        schema: [],
    },
    create: function (context) {
        const dataProperties = {};

        return {
            VariableDeclaration(node) {
                node.declarations.forEach(declaration => {
                    const { init } = declaration;
                    if (init) {
                        if (
                            (init.type === 'ArrayExpression' && init.elements.length === 0) ||
                            (init.type === 'ObjectExpression' && init.properties.length === 0)
                        ) {
                            context.report({
                                node: declaration,
                                message: 'Initialization should not be empty for arrays or objects.',
                            });
                        }
                    }
                });
            },
            'Property[key.name="data"]'(node) {
                if (node.value.type === 'FunctionExpression') {
                    const returnStatement = node.value.body.body.find(
                        stmt => stmt.type === 'ReturnStatement'
                    );
                    if (returnStatement && returnStatement.argument.type === 'ObjectExpression') {
                        returnStatement.argument.properties.forEach(prop => {
                            dataProperties[prop.key.name] = prop.value;
                            if (
                                (prop.value.type === 'ArrayExpression' && prop.value.elements.length === 0) ||
                                (prop.value.type === 'ObjectExpression' && prop.value.properties.length === 0)
                            ) {
                                context.report({
                                    node: prop,
                                    message: '记得非空判断',
                                });
                            }
                        });
                    }
                }
            },
            MemberExpression(node) {
                if (node.object.name === 'this' && dataProperties[node.property.name]) {
                    const prop = dataProperties[node.property.name];
                    if (
                        (prop.type === 'ArrayExpression' && prop.elements.length === 0) ||
                        (prop.type === 'ObjectExpression' && prop.properties.length === 0)
                    ) {
                        context.report({
                            node,
                            message: 'Data property should be checked for non-emptiness before usage.',
                        });
                    }
                }
            },
        };
    },
};
相关推荐
娃哈哈哈哈呀2 小时前
vue中的css深度选择器v-deep 配合!important
前端·css·vue.js
真滴book理喻5 小时前
Vue(四)
前端·javascript·vue.js
不是鱼7 小时前
构建React基础及理解与Vue的区别
前端·vue.js·react.js
开心工作室_kaic7 小时前
springboot476基于vue篮球联盟管理系统(论文+源码)_kaic
前端·javascript·vue.js
川石教育7 小时前
Vue前端开发-缓存优化
前端·javascript·vue.js·缓存·前端框架·vue·数据缓存
搏博7 小时前
使用Vue创建前后端分离项目的过程(前端部分)
前端·javascript·vue.js
isSamle7 小时前
使用Vue+Django开发的旅游路书应用
前端·vue.js·django
ss2738 小时前
基于Springboot + vue实现的汽车资讯网站
vue.js·spring boot·后端
武昌库里写JAVA9 小时前
浅谈怎样系统的准备前端面试
数据结构·vue.js·spring boot·算法·课程设计
TttHhhYy9 小时前
uniapp+vue开发app,蓝牙连接,蓝牙接收文件保存到手机特定文件夹,从手机特定目录(可自定义),读取文件内容,这篇首先说如何读取,手机目录如何寻找
开发语言·前端·javascript·vue.js·uni-app