Starting vue js dev server gives eror: .plugins[0] may only be a two-tuple or three-tuple

Total
1
Shares

I am using Vue CLI version 3 to run a Vue application inside a Docker container. To start the development server, I run:

https://cli.vuejs.org/guide/cli-service.html

This gives the following error:

 ERROR  Failed to compile with 1 errors                                                                                                                                                          17:05:14

 error  in ./app/main.js

Module build failed (from ./node_modules/@vue/cli-plugin-babel/node_modules/babel-loader/lib/index.js):
Error: .plugins[0] may only be a two-tuple or three-tuple
    at assertPluginItem (/home/src/node_modules/@babel/core/lib/config/validation/option-assertions.js:235:13)
    at arr.forEach (/home/src/node_modules/@babel/core/lib/config/validation/option-assertions.js:222:30)
    at Array.forEach (<anonymous>)
    at assertPluginList (/home/src/node_modules/@babel/core/lib/config/validation/option-assertions.js:222:9)
    at Object.keys.forEach.key (/home/src/node_modules/@babel/core/lib/config/validation/options.js:107:5)
    at Array.forEach (<anonymous>)
    at validateNested (/home/src/node_modules/@babel/core/lib/config/validation/options.js:83:21)
    at validate (/home/src/node_modules/@babel/core/lib/config/validation/options.js:74:10)
    at file (/home/src/node_modules/@babel/core/lib/config/config-chain.js:174:34)
    at cachedFunction (/home/src/node_modules/@babel/core/lib/config/caching.js:33:19)
    at buildRootChain (/home/src/node_modules/@babel/core/lib/config/config-chain.js:120:36)
    at loadPrivatePartialConfig (/home/src/node_modules/@babel/core/lib/config/partial.js:85:55)
    at Object.loadPartialConfig (/home/src/node_modules/@babel/core/lib/config/partial.js:110:18)
    at Object.<anonymous> (/home/src/node_modules/@vue/cli-plugin-babel/node_modules/babel-loader/lib/index.js:140:26)
    at Generator.next (<anonymous>)
    at asyncGeneratorStep (/home/src/node_modules/@vue/cli-plugin-babel/node_modules/babel-loader/lib/index.js:3:103)

 @ multi (webpack)-dev-server/client/index.js ./node_modules/@vue/cli-service/node_modules/webpack/hot/dev-server.js ./app/main.js

I suspect that the offending code is the following, in my .babelrc file:

  "plugins": [
    ["transform-runtime", "transform-vue-jsx", "transform-regenerator", {
      "polyfill": false,
      "regenerator": true
    }]

Could someone suggest how I could go about resolving this? Thanks!


Solution

Your [ is in the wrong place. It should be

"plugins": [
  "transform-runtime", 
  "transform-vue-jsx", 
  ["transform-regenerator", {
    "polyfill": false,
    "regenerator": true
  }]
]
Leave a Reply

Your email address will not be published. Required fields are marked *