javascript – 从’vue’导入Vue将“不同的”Vue导入到不同的文件中

这个问题可能更多是关于Webpack和ES6导入而不是关于Vue.

我正在编写一个Vuex变异,它将一个新的mykey：[]添加到一个状态的对象中.这需要使用Vue.set(state.myobj,’mykey’,[]),以便新数组获得反应性.

但是,当我将Vue从’vue’导入到我的mutation.js并使用Vue.set(…)时,它无法解决问题(它什么都不做).问题似乎是在我的main.js文件中创建Vue对象时,Vue与我在主js文件中使用的Vue不同.

我已经证实问题与Vue导入mutation.js的方式有关.如果我在main.js中编写window.MY_VUE = Vue然后在mutation.js中使用window.MY_VUE.set(…),则新数组按预期工作,即当我推送到数组时,更改会被正确反映在DOM中.当然,比较window.MY_VUE === mutation.js中的Vue返回false.

难道我做错了什么？解决问题的正确方法是什么？

注意：作为一种解决方法,我现在替换该对象：

state.myobj = { ...state.myobj, mykey: [] }

我正在使用Vue 2.4.2,Vuex 2.4.0和Webpack 2.7.0.我没有使用Webpack代码分割.

解决方法:

我找到了直接的原因.我首先注意到,在加载应用程序时,“您正在开发模式下运行Vue”.在控制台中打印了两次.他们都来自vue.runtime.esm.js：7417,但是来自不同的网址. (Webpack网址,因为我正在运行npm run dev.)我注意到我有两个node_modules目录(在./和../../),并且出于某种原因,Vue从两个地方加载了一次.可能是我以错误的顺序安装了npm软件包.删除node_modules目录并再次运行npm install解决了这个问题：现在我可以从mutation.js中的’vue’导入Vue,并且Vue.set(…)按预期工作.

无论如何,我仍然没有完全知道实际的npm问题或如何不再这样做.

标签：javascript,npm,vuejs2,webpack-2
来源： https://codeday.me/bug/20190608/1196200.html