vue组件终端报错: error Component name “xxx“ should always be multi-word vue/multi-word-component-names

简介: 笔记

前言


今天使用vscode开发vue引入组件的时候遇到一个错误,我的组件名称以及路径都是没问题的,但是就是运行不起来

错误信息截图如下

6.png7.png

分析问题


根据提示信息可知是组件名出了问题,概就是组件名应该使多个单词拼接横线组成的。


但是我又查阅了官方的风格指南,发现组件名可以这样命名,一个单词单身首字母大写也是没问题的


查阅资料发现,这其实是语法检查的时候把不规范的代码(即命名不规范)当成了错误。


解决问题


针对这种问题,我个人推荐:修改配置项,关闭语法检查


1 打开并且编译vue.config.js

项目的根目录找到vue.config.js文件


8.png

2 添加配置

添加配置: lintOnSave:false,,作用是关闭语法检查

9.png

const { defineConfig } = require('@vue/cli-service')
module.exports = defineConfig({
  transpileDependencies: true,
  lintOnSave:false, //  关闭语法检查 
})

3 保存重启

保存文件,重新执行npm run serve即可

10.png

解决

11.png


相关文章
|
9月前
|
JavaScript
Vue中ref创建_基本类型的响应式数据,在Vue2的年代,数据配在data里,Vue3的区别是不把响应数据写在data里,那个数据是响应式的用ref包一下,let name = ref(“张三“)
Vue中ref创建_基本类型的响应式数据,在Vue2的年代,数据配在data里,Vue3的区别是不把响应数据写在data里,那个数据是响应式的用ref包一下,let name = ref(“张三“)
|
7月前
|
JavaScript
Vue+element_Table树形数据与懒加载报错Error in render: “RangeError: Maximum call stack size exceeded“
本文讨论了在使用Vue和Element UI实现树形数据和懒加载时遇到的“Maximum call stack size exceeded”错误,指出问题的原因通常是因为数据中的唯一标识符`id`不唯一,导致递归渲染造成调用栈溢出。
380 1
Vue+element_Table树形数据与懒加载报错Error in render: “RangeError: Maximum call stack size exceeded“
|
7月前
|
人工智能 JavaScript 索引
Duplicate keys detected: This may cause an update error.【Vue遍历渲染报错的解决】
这篇文章讨论了在Vue中进行列表渲染时遇到的“Duplicate keys detected”错误。这个错误通常发生在使用 `v-for` 指令渲染列表时,如果没有为每个循环项指定一个唯一的 `key` 属性,或者指定的 `key` 属性值重复了。文章提供了导致错误的原始代码示例,并给出了修正后的代码,通过在 `key` 绑定中加入索引确保 `key` 的唯一性。此外,文章还解释了为什么需要唯一 `key` 以及如何解决这个问题。
Duplicate keys detected: This may cause an update error.【Vue遍历渲染报错的解决】
|
8月前
|
JavaScript 编译器
成功解决:Module build failed: Error: Vue packages version mismatch
这篇文章记录了解决Vue项目中遇到的"Module build failed: Error: Vue packages version mismatch"错误的步骤,原因是项目中Vue依赖的版本不一致,解决方法是删除`node_modules`后重新安装指定版本的Vue和`vue-template-compiler`,确保版本匹配,最终成功运行项目。
成功解决:Module build failed: Error: Vue packages version mismatch
|
8月前
|
JavaScript 算法 数据安全/隐私保护
Vue 打包 Error: error:0308010C:digital envelope routines::unsupported
Vue 打包 Error: error:0308010C:digital envelope routines::unsupported
133 0
|
9月前
|
JavaScript
vue报错 | Duplicate keys detected: ‘0’. This may cause an update error.
vue报错 | Duplicate keys detected: ‘0’. This may cause an update error.
120 3
|
9月前
|
JavaScript 索引
Component name “index“ should always be multi-word vue/multi-word-component-names
Component name “index“ should always be multi-word vue/multi-word-component-names
|
10月前
|
JavaScript 算法
“Error: error:0308010C:digital envelope routines::unsupported”启动vue项目遇到一个错误【已解决
“Error: error:0308010C:digital envelope routines::unsupported”启动vue项目遇到一个错误【已解决
178 1
|
10月前
|
JavaScript
error Component name “Login“ should always be multi-word vue/multi-word-component-names【已解决】
error Component name “Login“ should always be multi-word vue/multi-word-component-names【已解决】
732 1
|
3天前
|
JavaScript
vue实现任务周期cron表达式选择组件
vue实现任务周期cron表达式选择组件
32 4