eslint自定义规则(禁用 localStorage和sessionStorage)

最新推荐文章于 2025-06-20 08:44:27 发布

天心天地生

最新推荐文章于 2025-06-20 08:44:27 发布

阅读量468

点赞数 1

CC 4.0 BY-SA版权

分类专栏： JS 文章标签：前端 npm javascript

本文链接：https://blog.csdn.net/tianxintiandisheng/article/details/129688434

JS 专栏收录该内容

42 篇文章

订阅专栏

项目通过eslint的no-restricted-syntax规则禁止直接使用localStorage和sessionStorage，要求成员使用utils模块中的storage接口。文章提供了两种方案，一是配置eslint规则，二是自定义eslint插件，后者虽复杂但可实现更定制化的检查。

背景

项目为了统一管理localStorage和sessionStorage,使用了统一的方法对Storage进行存取.为限制项目成员直接使用localStorage和sessionStorage,需要通过eslint对直接引用的形式加以限制

方案一使用eslint的开放性禁用规则`no-restricted-syntax`

修改文件.eslintrc,如下

module.exports = {
  rules:{
    'no-restricted-syntax': [
      'error',
      {
        selector: "CallExpression[callee.object.name='localStorage']",
        message: '项目中不允许直接使用`localStorage` , 请使用utils中的storage来替代',
      },
      {
        selector: "CallExpression[callee.object.name='sessionStorage']",
        message: '项目中不允许直接使用`sessionStorage` , 请使用utils中的storage来替代',
      },
      {
        selector: "CallExpression[callee.object.object.name='window'][callee.object.property.name='localStorage']",
        message: '项目中不允许直接使用`localStorage` , 请使用utils中的storage来替代',
      },
      {
        selector: "CallExpression[callee.object.object.name='window'][callee.object.property.name='sessionStorage']",
        message: '项目中不允许直接使用`sessionStorage` , 请使用utils中的storage来替代',
      },
    ],
  }
}