webpack strips global variable for mounting 'new Vue' as app

Question

Webpack production build is stripping out the global variable for mounting my vue app - the var vm = part. So:

var vm = new Vue({
   ...
});

gets compiled to just: new Vue({ ... });

I have no webpack.config.js so its just using the default - the npm dev build task DOES retain the var vm = new Vue !

The vue app works - but the reason why this is important is I now want to be able to call one of the app's methods from outside of the vue app. This is possible - something like: <button onclick="vm.foo()"> assuming that my vue app is known globally as vm

I'm happy to accept someother workaround... but I assume some webpack config setting will fix it. ?

---

if it helps: my package.json looks like this:

  "scripts": {
    "development": "cross-env NODE_ENV=development node_modules/webpack/bin/webpack.js --
    "production": "cross-env NODE_ENV=production node_modules/webpack/bin/webpack.js --progress --config=node_modules/webpack-mix/setup/webpack.config.js"
  },
  "devDependencies": {
    "vue": "^2.6.14",
    "cross-env": "^7.0.3",
    "resolve-url-loader": "^3.1.2",
    "sass": "^1.32.0",
    "sass-loader": "^8.0.2",
    "vue-template-compiler": "^2.6.12",
    "webpack-mix": "^3.0.0"
  }

Answer 1

Solved this myself:

window.vm= new Vue({ ... });

instead of setting a var (or const) - explicitly defining window when setting the varaible stops webpack stripping it.