Upgrading to @vue/cli-plugin-babel@4.5.18 causes compilation failure

Version

4.5.18

Reproduction link

github.com

Environment info

System:
    OS: Windows 10 10.0.19044
    CPU: (6) x64 Intel(R) Core(TM) i7-8700B CPU @ 3.20GHz
  Binaries:
    Node: 14.15.5 - C:\Program Files\nodejs\node.EXE
    Yarn: Not Found
    npm: 8.12.1 - C:\Program Files\nodejs\npm.CMD
  Browsers:
    Chrome: Not Found
    Edge: Spartan (44.19041.1266.0), Chromium (102.0.1245.44), ChromiumDev (104.0.1293.1)  npmPackages:
    @vue/babel-helper-vue-jsx-merge-props:  1.2.1
    @vue/babel-helper-vue-transform-on:  1.0.2
    @vue/babel-plugin-jsx:  1.1.1
    @vue/babel-plugin-transform-vue-jsx:  1.2.1
    @vue/babel-preset-app:  4.5.18
    @vue/babel-preset-jsx:  1.2.4
    @vue/babel-sugar-composition-api-inject-h:  1.2.1
    @vue/babel-sugar-composition-api-render-instance:  1.2.4
    @vue/babel-sugar-functional-vue:  1.2.2
    @vue/babel-sugar-inject-h:  1.2.2
    @vue/babel-sugar-v-model:  1.2.3
    @vue/babel-sugar-v-on:  1.2.3
    @vue/cli-overlay:  4.5.18
    @vue/cli-plugin-babel: ^4.5.18 => 4.5.18
    @vue/cli-plugin-eslint: ^4.5.18 => 4.5.18
    @vue/cli-plugin-router: ^4.5.18 => 4.5.18
    @vue/cli-plugin-typescript: ^4.5.18 => 4.5.18
    @vue/cli-plugin-unit-jest: ^4.5.18 => 4.5.18
    @vue/cli-plugin-vuex:  4.5.18
    @vue/cli-service: ^4.5.18 => 4.5.18
    @vue/cli-shared-utils:  4.5.18
    @vue/component-compiler-utils:  3.2.0
    @vue/eslint-config-prettier: ^6.0.0 => 6.0.0
    @vue/eslint-config-typescript: ^5.0.2 => 5.1.0
    @vue/preload-webpack-plugin:  1.1.2
    @vue/test-utils: ^1.3.0 => 1.3.0
    @vue/web-component-wrapper:  1.3.0
    eslint-plugin-vue: ^6.2.2 => 6.2.2
    jest-serializer-vue:  2.0.2
    typescript: ~3.8.3 => 3.8.3
    vue: ^2.6.14 => 2.6.14
    vue-class-component: ^7.2.6 => 7.2.6
    vue-cli-plugin-vuetify: ^2.5.1 => 2.5.1
    vue-eslint-parser:  7.5.0
    vue-hot-reload-api:  2.3.4
    vue-jest:  3.0.7
    vue-loader:  15.9.6 (16.1.2)
    vue-property-decorator: ^9.1.2 => 9.1.2
    vue-router: ^3.5.4 => 3.5.4
    vue-style-loader:  4.1.2
    vue-template-compiler: ^2.6.14 => 2.6.14
    vue-template-es2015-compiler:  1.9.1
    vuetify: ^2.6.6 => 2.6.6
    vuetify-loader: ^1.8.0 => 1.8.0
    vuex: ^3.6.2 => 3.6.2
  npmGlobalPackages:
    @vue/cli: Not Found

Steps to reproduce

You can build the existing project via: npm run build:dev

When targeting @vue/cli-plugin-babel@4.5.17 the project builds without errors. Targeting @vue/cli-plugin-babel@4.5.18 produces compilation errors.

What is expected?

The expectation would be to compile without error.

What is actually happening?

Failed to compile with 1 error 11:59:22 a.m.

error in ./src/main.ts

Module parse failed: Unexpected token (18:41) File was processed with these loaders:

• ./node_modules/cache-loader/dist/cjs.js
• ./node_modules/babel-loader/lib/index.js
• ./node_modules/ts-loader/index.js
• ./node_modules/eslint-loader/index.js You may need an additional loader to handle the result of these loaders. | args[key] = value; | });

const route = searchParams.get(“route”) ?? undefined; | const component = route && Object.values(Route).includes(route) ? The${route}Container : “TheShell”; |

@ multi ./src/main.ts

---

I have stripped out pretty much everything in order to exhibit the behavior.

Background: We utilize main.ts to either launch our full app (TheShell) or to launch containerized components (inline or in new windows). I have removed all of the containerized components.

[sodatea]

Oh, I got it. It’s because IE 11 has reached end-of-life. So the “not dead” query in .browserslistrc excludes it. You need to add an IE 11 line to the end of .browserslistrc. Remove node_modules/.cache. And then run the build again.

[chinaxcy]

手动加 presets: [ [‘@babel/preset-env’] ]，也可以解决， 主要是更新了什么，以前不用配置啊