SyntaxError: /: Unexpected token, expected “,”Error resolution

mistake

Local old project vue2.+webpack4 encountered startup and packaging errors when upgrading webpack5:

Syntax Error: SyntaxError: / Unexpected token, expected "," (1:8)
> 1 | [object Promise]
    |         ^
  2 | export { render, staticRenderFns }

Finally, I found out that it was caused by prettier.

It is recommended to check out the above answer of *.Update Nodejs 14->18 — webpack have the same syntaxError: /.../: Unexpected token, expected "," (1:8) for ALL Vue 2 components in the project

Cause

In prettier v3.0.0, the default value is changed from es5 to 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 ( 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.

solve

Prettier plugin version falls back to v2.8.8

"prettier":"v2.8.8"

vue-loader configuration prettify: false.

{
        test: /\.vue$/,
        loader: 'vue-loader',
        options: {
          // The vue loader does not use prettier formatting when processing .vue templates by default          prettify: false,
        },
   },

The above is the detailed content of SyntaxError: /: Unexpected token, expected "," error resolution. For more information about SyntaxError vue resolution, please follow my other related articles!