Question

我有一个带有vue js代码的js文件scripts.js：

var app2  = new Vue({
    el: '#app-2',
    data:{
        message: 'Some msg'
    }
})

然后我用gulp elixir webpack构建js文件

elixir((mix) => {
    mix.sass('app.scss')
       .webpack('app.js')
});

然后我在html中加载public / js / app.js文件，并且每个都运行良好。但是如果我尝试记录这个var，我会得到一个未定义的错误。

console.log(app2); //undefined

如果我将scripts.js加载到没有webpack的html，那就没关系了。

然后，如何在webpack构建后记录此变量？感谢

Answer 1

这个变量可能是缩小的并且是沙盒的，并且在全局范围内不可用。如果您想在缩小后访问此变量，则必须以某种方式将其绑定到全局范围。

例如你可以这样做：

var app2  = new Vue({
    el: '#app-2',
    data:{
        message: 'Some msg'
    }
});
window["app2"] = app2;
//window.app2 = app2;  <- it should also work

这种方式app2将始终在浏览器的全局上下文中可用。

elixir webpack之后的chrome控制台中未定义的var

1 个答案: