Compiling with vue-cli-service build --mode development --modern produces output that fails to run

[tomnielsen]

Version

3.4.1

Environment info

MacOS/Chrome 72

FYI: The instructions on this page to run `vue info` does not work anymore.

Steps to reproduce

Steps are so basic, no project is required.

1. Create a new project with vue create hello-world
2. Use all defaults when creating.
3. In new project directory, execute vue-cli-service build --mode development --modern
4. Try to run outputted vue app.
   Result: Produced project will error with
   Uncaught TypeError: Cannot read property 'webpackHotUpdate' of undefined
   at app.js:5
   at app.js:794

What is expected?

The issue is that globalObject should be self not this

What is actually happening?

The dev version of the code is using 'this' which fails because this is not defined. It should be self.

A fix can clearly be seen in resolveLibConfig.js that probably just never made it into dev.js

---

globalObject in dev.js should probably have same fix as found in resolveLibConfig.js

See:

vue-cli/packages/@vue/cli-service/lib/config/dev.js

Line 16 in 94ff7bf

.globalObject('this')

vs

vue-cli/packages/@vue/cli-service/lib/commands/build/resolveLibConfig.js

Line 105 in 94ff7bf

globalObject: `(typeof self !== 'undefined' ? self : this)`

My fix to dev.js was:

      webpackConfig
        .output
          .globalObject(`(typeof self !== 'undefined' ? self : this)`)

[MatanYadaev]

➕1️⃣