webpack打包在控制台不能获取变量

Question

用webpack打包后，在浏览器的console里不能获取变量是为何？
比如我用了vue，

var vm=new Vue({
data:{
num :0
}})

然后我想在控制台里修改一下num，vm.num=1，这样就会报错，vm没有；或者new Vue也是找不到的。
webpack打包的main.js没有压缩，在控制台看main.js还是vm这个变量名。

Answer 1

@spencerht 说的对，webpack打包会将全局变量封装到闭包内，你访问不到的。
两个简单的变通办法：

1. import vue后，将vue暴漏给window对象
2. 单独引用vue，webpack做一个externals设置，这样不会将vue打包到一起了

Answer 2

webpack打包过后，会将内部代码封闭到一个立刻执行的函数作用域中去，防止污染全局。
所以你在全局访问那些变量时并不能获取到。

Answer 3

window.vm=...

Answer 4

可以通过webpack ProvidePlugin解决