本地老工程vue2.7.x+webpack4在升級(jí)webpack5的時(shí)候遇啟動(dòng)和打包報(bào)錯(cuò):
Syntax Error: SyntaxError: /xxxxx.vue Unexpected token, expected "," (1:8)
> 1 | [object Promise]
| ^
2 | export { render, staticRenderFns }
最后才發(fā)現(xiàn)是prettier導(dǎo)致的。
推薦看看stackoverflow上面這個(gè)回答。Update Nodejs 14->18 — webpack have the same syntaxError: /.../xxx.vue: Unexpected token, expected "," (1:8) for ALL Vue 2 components in the project
導(dǎo)致原因：
在prettier v3.0.0中纳令，默認(rèn)值從es5更改為all
Default value changed from es5 to all in v3.0.0
Print trailing commas wherever possible in multi-line comma-separated syntactic structures. (A single-line array, for example, never gets trailing commas.)
Valid options:
"all" - Trailing commas wherever possible (including function parameters and calls). To run, JavaScript code formatted this way needs an engine that supports ES2017 (Node.js 8+ or a modern browser) or downlevel compilation. This also enables trailing commas in type parameters in TypeScript (supported since TypeScript 2.7 released in January 2018).
"es5" - Trailing commas where valid in ES5 (objects, arrays, etc.). No trailing commas in type parameters in TypeScript.
"none" - No trailing commas.
vue-loader涉及prettier配置項(xiàng)
解決方法1
prettier插件版本回退到v2.8.8
"prettier":"v2.8.8"
解決方法2
vue-loader配置prettify: false侥锦。
{
test: /\.vue$/,
loader: 'vue-loader',
options: {
// vue loader在處理.vue模板時(shí)編譯后不用prettier格式化
prettify: false,
},
},
