Babel not transpiling chunk-vendors for IE11, in Vue-CLI project

Question

I have a Vue-CLI webapp that needs to support IE11. In package.json we have set:

"browserslist": [
    "> 1%",
    "last 2 versions",
    "not ie <= 8",
    "ie 11"
  ]

and this seems to work for the generated app.x.js files: they don't contain any ... operators for instance.

However, the generated chunk-vendors.x.js do contain ... operators, and hence fail on IE11.

Relevant parts of the package.json:

  "devDependencies": {
    "@vue/cli-plugin-babel": "^3.3.0",
    "@vue/cli-plugin-eslint": "^3.3.0",
    "@vue/cli-service": "^3.3.0",
    "babel-eslint": "^10.0.1",
    "eslint": "^5.8.0",
    "eslint-plugin-vue": "^5.0.0",
    "pug": "^2.0.3",
    "pug-plain-loader": "^1.0.0",
    "vue-cli-plugin-pug": "^1.0.7",
    "vue-template-compiler": "^2.5.21"
  },

There are no relevant changes in vue.config.js, so the default behaviour is being used.

What do I need to change to ensure chunk-vendors.x.js is transpiled for IE11?

Answer 1

The answer seems to be, not so much "make sure all dependencies are transpiled" (which apparently can cause a lot of problems), but "make sure the specific dependencies which are causing issues are transpiled".

You can do this by adding a line to vue.config.js:

transpileDependencies: ['/node_modules/myproblematicmodule/']