EsLint common errors
Error judgment: When we write code, after saving, the project reports an error. If the error message is xxx-xxx-xxxthis type of error report, it can basically be concluded that it is an ESlint error report.
Common error messages are as follows: The respective meanings are as follows:
EsLintThe syntax rules for common verification code formats are as follows:
1. quotes
Means: the string needs to be wrapped in single quotes
2. key-spacing
Means: There needs to be a space between the attribute and the value of the object
3. comma-dangle
Means: the end of the object or array, no extra commas allowed
4. no-multiple-empty-lines
Means: Multiple blank lines are not allowed,大于等于2
5. no-trailing-spaces
Means: Do not allow extra spaces at the end of the line
6. eol-last
Means: There must be a blank line at the end of the file
7. spaced-comment
Means: Enforce consistent spacing after // or /* in comments
8. indent
Means: enforce consistent indentation
9. import/first
Means: The import statement of the imported module must be declared at the top of the file
10. space-before-function-paren
Means: There must be a space before the formal parameters of the method
In actual development:
We will configure Eslint so that when we Ctrl + Spress it will be automatically formatted to Eslintmeet the rules, which is very nice
The configuration steps are as follows:
First open the settings of Vscode, search for tabsize, change the default four spaces of a tab to two spaces,
install two plug-ins in Vscode, and configure
Plug-in 1: EsLint Author: Dirk baeumer
After installation, configure it in the document in the upper right corner of Vscode settings: the following code:
// EsLint 配置
"editor.codeActionsOnSave": {
"source.fixAll": true
},
Plug-in 2: prettier-Code forma t Author: Prettier
After installation, configure it in the document in the upper right corner of Vscode settings: the following code:
// prettier 配置
"eslint.alwaysShowStatus": true,
"prettier.trailingComma": "none",
"prettier.semi": false,
// 每行文字合数超出此限制会被迫换行
"prettier.printWidth": 300,
// 使用单引号替换双引号
"prettier.singleQuote": true,
"prettier.arrowParens": "avoid",
// 设置.vue 文件中，HTML代码的格式化插件
"vetur.format.defaultFormatter.html": "js-beautify-html",
"vetur.ignoreProjectWarning": true,
"vetur.format.defaultFormatterOptions": {
"prettier": {
"trailingComma":"none",
"semi":false,
"singleQuote":true,
"arrowParens":"avoid",
"printWidth":300
},
"js-beautify-html": {
"wrap_attributes": "force-expand-multiline"
}
}
The configuration is here and the last step is short:
The last step:
Put the .prettierrc file into the C:\Users\Dell directory, that is, into your system file directory.
tips:Different computers have different paths.
After placing it, then configure it in the document in the upper right corner of the Vscode setting:
"prettier.configPath":"C:\\Users\\Dell\\.prettierrc"
tips:The path uses double slashes here, do not use single slashes
There is no .prettierrc file, private chat~~~
