Vue-cli: Adding webpack plugin in chainWebpack mode failed

[MarvinXu]

Version

3.0.0-rc.3

Reproduction link

https://github.com/MarvinXu/vue-cli-mpa-test/commit/c5915751c2d98b4434908bc7e1b565007ab0a69c

Steps to reproduce

https://cli.vuejs.org/guide/webpack.html#modifying-options-of-a-plugin

module.exports = {
  chainWebpack: config => {
    config
      .plugin('html')
      .tap(args => {
        args[0].template = '/Users/username/proj/app/templates/index.html'
        return args
      })
  }
}

npm run serve

What is expected?

no error

What is actually happening?

TypeError: Cannot read property '__expression' of undefined

[LinusBorg]

Will take a look tonight, can't really imagine this is broken

[MarvinXu]

I tested it again on my home pc, broke still.
win7 ; npm5.6.0;
reproduction steps:

1. vue create myproject
2. add vue.config.js

module.exports = {
  chainWebpack: config => {
    config
      .plugin('html')
      .tap(args => {
        return args
      })
  }
}

1. npm run serve

[LinusBorg]

a freshly created project builds fine for me:

OS / Node version / npm version ?

Can you share the full stack trace of the error? which module does this error come from?

[LinusBorg]

Ok, your own project fails. But now I realize you are using the "pages" feature.

See the docs here: https://cli.vuejs.org/config/#pages

TIP

When building in multi-page mode, the webpack config will contain different plugins (there will be multiple instances of html-webpack-plugin and preload-webpack-plugin). Make sure to run vue inspect if you are trying to modify the options for those plugins.

In other words: since you are using the pages option, there's no plugin called html.

Thorstens-MacBook-Pro:vue-cli-mpa-test thorsten$ vue inspect --plugins
[
  'vue-loader',
  'define',
  'case-sensitive-paths',
  'friendly-errors',
  'hmr',
  'no-emit-on-errors',
  'progress',
  'html-index',
  'html-subpage',
  'preload-index',
  'prefetch-index',
  'preload-subpage',
  'prefetch-subpage',
  'copy'
]

You might have to just each of those for whatever you want to do.

[MarvinXu]

My bad, forgot the "minimal reproduction" basic... Thanks!

[jinwyp]

Thanks @LinusBorg .

[stephanepericat]

vue inspect --plugins
[
  'vue-loader',
  'define',
  'case-sensitive-paths',
  'friendly-errors',
  'hmr',
  'no-emit-on-errors',
  'progress',
  'html',
  'preload',
  'prefetch'
]

I get the same issue, here is my list of plugins...

looks like calling "config.plugin()" causes this error no matter what option you overwrite

[LinusBorg]

You might have the same symptom, but appearantly are nor using the pages feature, so your automation a different.

Hence:

Open an issue and provide a reproduction.

This issue is resolved and closed.