84669인 학습
152542인 학습
20005인 학습
5487인 학습
7821인 학습
359900인 학습
3350인 학습
180660인 학습
48569인 학습
18603인 학습
40936인 학습
1549인 학습
1183인 학습
32909인 학습
Vue.component(name, function (resolve) { require([path], resolve)})
name path都是传入的值 然后动态注册模块 但require是被强制静态化的导致path传了无效
问高人说用异步组件,去加载。无奈技术有限 无入手方向或头绪请给位指点 一二 或是贴码 更好 多谢各位
首先列出参考:
Vue异步组件
Webpack Dynamic Require
Webpack Code Spliting
然后用vue-cli的webpack-simple template写了个简单的demo:仅仅是将App.vue丢到了src/component下面(目的是为了体现webpack的context解析),然后修改import的方式为dynamic require。其实要动态require大概的意思就是要告诉webpack上下文,不然webpack在编译时并不知道这个module是什么(因为是个变量)。
main.js
import Vue from 'vue' // import App from './App.vue' const name = 'App.vue' const App = (resolve) => { require.ensure([], (require) => { resolve(require.context('./component', false, /\.vue$/)(`./${name}`)); }, 'app'); }; new Vue({ el: '#app', render: h => h(App) })
首先列出参考:
Vue异步组件
Webpack Dynamic Require
Webpack Code Spliting
然后用vue-cli的webpack-simple template写了个简单的demo:
仅仅是将App.vue丢到了src/component下面(目的是为了体现webpack的context解析),然后修改import的方式为dynamic require。
其实要动态require大概的意思就是要告诉webpack上下文,不然webpack在编译时并不知道这个module是什么(因为是个变量)。