Vue规范中设置的‘vue/no-unused-vars‘没起作用

最新推荐文章于 2024-08-03 16:15:33 发布

双击空格001

最新推荐文章于 2024-08-03 16:15:33 发布

阅读量2.6k

点赞数 1

分类专栏： vscode技巧解决bug 文章标签： vscode elementui

版权

4 篇文章

订阅专栏

2 篇文章

订阅专栏

本文介绍了如何处理Vue项目中出现的ESLint警告`vue/no-unused-vars`，提供两种解决方案：一是将`scope`替换为`{}

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

[vue/no-unused-vars] ‘scope’ is defined but never used.eslint-plugin-vue
转载于: https://www.whidy.net/vue-eslint-rules-no-unused-vars-not-working/

两个较好方案。

将 scope 换成 {}，这个是最简单快速的方案，例如以上示例的代码片段可修改为：

<el-table-column label="一个自定义的列" width="200">
  <template slot-scope="{}"> {{otherData.name}} </template>
</el-table-column>

第二个相对复杂些，并且需要配合 VSCode 设置，大致如下：

首先、ESLint 的配置依旧要用 ‘vue/no-unused-vars’: ‘off’ ，

其次、编辑器 VSCode 也要进行配置，添加一条 “vetur.validation.template”: false （前提是启用了 Vetur 插件）

所以说第二条方案是推荐的，而红色波浪并不是因为 ESLint 配置错误造成，而是 Vetur 内置服务检测触发，当然也许你会想到 Vetur 为什么没有读取 ESLint 的配置进行，这个我精力有限，暂时也没办法深入研究。

其实还有个毁灭性的操作，就是关闭 Vetur，哈哈哈，开个玩笑，用 VSCode 开发 Vue 项目，这个当然不能关啦。

针对Vue3.x 也许可以通过文档查到设置vue/no-unused-vars，直接将其禁用，比如在 rules 里面添加一行设置如下：

rules: {
  'vue/no-unused-vars': 'off',
}

rules: {
  "vue/no-unused-vars": ["error", {
    "ignorePattern": "^_"
  }]
}

结语
项目开发中经常遇到奇奇怪怪的问题，除了配置检查（可能不同版本造成的配置错误）、还要注意插件、自定义编辑器设置等多方面因素进行问题排除。