vue脚手架报错: error Unexpected trailing comma comma-dangle
报错代码:
// An highlighted block
911:17 error Unexpected trailing comma comma-dangle
922:19 error Unexpected trailing comma comma-dangle
939:28 error Unexpected trailing comma comma-dangle
944:66 error Unexpected trailing comma comma-dangle
947:66 error Unexpected trailing comma comma-dangle
950:66 error Unexpected trailing comma comma-dangle
953:66 error Unexpected trailing comma comma-dangle
956:66 error Unexpected trailing comma comma-dangle
958:71 error Unexpected trailing comma comma-dangle
974:28 error Unexpected trailing comma comma-dangle
979:67 error Unexpected trailing comma comma-dangle
982:66 error Unexpected trailing comma comma-dangle
985:66 error Unexpected trailing comma comma-dangle
988:66 error Unexpected trailing comma comma-dangle
991:66 error Unexpected trailing comma comma-dangle
993:71 error Unexpected trailing comma comma-dangle
999:23 error Unexpected trailing comma comma-dangle
1006:23 error Unexpected trailing comma comma-dangle
1030:65 error Unexpected trailing comma comma-dangle
1033:65 error Unexpected trailing comma comma-dangle
1034:10 error Unexpected trailing comma comma-dangle
1035:8 error Unexpected trailing comma comma-dangle
1093:38 error Unexpected trailing comma comma-dangle
1097:37 error Unexpected trailing comma comma-dangle
1124:28 error Unexpected trailing comma comma-dangle
1132:38 error Unexpected trailing comma comma-dangle
1136:37 error Unexpected trailing comma comma-dangle
.....
这种情况是由于vscode格式化vue代码的时候,会在下面代码的最后多加了一个逗号,导致过不了eslint的js格式化要求,所以报错。
addReportForm: {
referenceValueId: '',
reporterId: '',
reviewerId: '', ///这里多加了一个逗号
}
解决方案是:
1、不要用vue的格式化代码
2、配置eslint格式化vue代码
见链接:https://blog.csdn.net/SHUIYI_24/article/details/108234505.
最后vscode的配置如下:
{
"editor.fontSize": 25,
"workbench.startupEditor": "newUntitledFile",
"explorer.confirmDelete": false,
"workbench.iconTheme": "vscode-great-icons",
"workbench.sideBar.location": "right",
"[javascript]": {
"editor.defaultFormatter": "vscode.typescript-language-features"
},
"java.semanticHighlighting.enabled": true,
"files.exclude": {
"**/.classpath": true,
"**/.project": true,
"**/.settings": true,
"**/.factorypath": true
},
"[html]": {
"editor.defaultFormatter": "HookyQR.beautify"
},
"git.ignoreWindowsGit27Warning": true,
"eslint.codeAction.showDocumentation": {
// 每次保存的时候自动格式化
"editor.formatOnSave": true,
// 每次保存的时候将代码按eslint格式进行修复
"eslint.autoFixOnSave": true,
// 添加 vue 支持
"eslint.validate": [
"javascript",
"javascriptreact",
{
"language": "html",
"autoFix": true
},
{
"language": "vue",
"autoFix": true
}
],
// 让函数(名)和后面的括号之间加个空格
// "javascript.format.insertSpaceBeforeFunctionParenthesis": false,
// html格式化,这个按用户自身习惯选择
"vetur.format.defaultFormatter.html": "js-beautify-html",
// 让vue中的js按编辑器自带的ts格式进行格式化
"vetur.format.defaultFormatter.js": "vscode-typescript",
"vetur.format.defaultFormatterOptions": {
"js-beautify-html": {
"wrap_attributes": "auto" //根据喜欢的格式 force-aligned:标签属性换行 auto:标签属性不换行
// vue组件中html代码格式化样式
}
},
"search.exclude": {
"**/node_modules": true,
"**/bower_components": true,
"**/dist": true
},
"emmet.syntaxProfiles": {
"javascript": "jsx",
"vue": "html",
"vue-html": "html"
},
//autoFixedOnSave 设置已废弃,采用如下新的设置
"editor.codeActionsOnSave": {
"source.fixAll.eslint": true
},
"eslint.format.enable": true,
//autoFix默认开启,只需输入字符串数组即可
"eslint.validate": [
"javascript",
"vue",
"html"
],
"enable": true
}
}