Vue-loader: Loader option syntax doesn't work with advanced options

[decademoon]

https://github.com/vuejs/vue-loader/issues/536 suggests that we must use webpack-combine-loaders to convert an options object to a query string, but it doesn't work for all options objects.

Given this setup:

var combine = require('webpack-combine-loaders');

{
  test: /\.vue$/,
  loader: 'vue-loader',
  options: {
    loaders: {
      js: babelLoader,
    },
  },
}

This works:

const babelLoader = combine([{
  loader: 'babel-loader',
  query: {
    presets: ['es2015', 'stage-0'],
  },
}])
// babel-loader?presets[]=es2015&presets[]=stage-0

This doesn't:

const babelLoader = combine([{
  loader: 'babel-loader',
  query: {
    presets: [['es2015', { modules: false }], 'stage-0'],  // Nested array
  },
}])
// babel-loader?presets[][]=es2015&presets[][][modules]=false&presets[]=stage-0

It appears that https://github.com/webpack/loader-utils parseQuery can't handle the second case above.

How can I pass options to babel-loader? I can't rely on a .babelrc file since the options are dynamically determined in the webpack.config.js file.

[nemtsov]

@decademoon you can use the .babelrc env options to define your environments in .babelrc and then in the vue-loader's options.loaders.js use: babel-loader?forceEnv=<env_defined_in_babelrc>. I use this to have a different babel configuration for client and server -side js in server-side rendered vue apps.

[qiyuan-wang]

@decademoon I write a webpack plugin, vue-loader-options-plugin, to deal with babel-loader's options in vue-loader config, you can have a try.

[maoberlehner]

Any updates on this issue? This is very frustrating for me :(

[Akimyou]

I used the root git submodule for my project, have to use:

{
  babelrc: false,
  extends: resolve('.babelrc')
}

to specified local .babelrc file.

But vue-loader ignore it.

Thanks to @qiyuan-wang , It can work like this:

  plugins: [
    new VueLoaderOptionsPlugin({
      babel: {
        babelrc: false,
        extends: resolve('.babelrc')
      }
    })
  ]

[yyx990803]

Closing as this is resolved in v15