eslint reported an error Component name “home” should always be multi-word, file naming rules lead to problem solutions

When creating a new Vue project, you often need to configure eslint to format the code, but you will encounter various problems during use, such as: Component name “Home” should always be multi-word.eslintvue/multi-word-component -names
insert image description here
is actually eslint's verification of naming, which should be 多词组件名称named to prevent conflicts with existing and future HTML elements.
How to solve it, as follows:

The first way > Configure the .eslintrc.js file (*recommended)

Find the file in the root directory eslintrc.jsand configure the verification of the closed name. In this file, find rulesthe configuration, as follows:

// 关闭名称校验
'vue/multi-word-component-names': 'off'

As shown in the figure:
insert image description here
This method can be solved by pro-testing. There is also a more standardized method, but it is a bit troublesome, and the specified file is not processed.命名规则校验

The second way > Ignore the specified file

Only the specified file is ignored, and others continue to be verified, as in the following code:

// 忽略指定组件命名
'vue/multi-word-component-names': ['error', {
    
    
  ignores: ['Home'] // 在数组中放入组件的名称
}]

As shown in the picture:
insert image description here

The third way > turn off the verification of eslint, very rude (not recommended)

Also find eslintrc.jsthe file and add the following code to its configuration:

// 关闭eslint校验
lintOnSave: false 

As shown below:
insert image description here

Guess you like

Origin blog.csdn.net/qq_38188228/article/details/129000301