如果用下面的方式配置,引入的VUE文件,打包的時候只會打包我需要的vue
import Vue from 'vue'
import vueTap from 'v-tap';
import $ from '@/public/libs/zepto.min';
import pkg from '../package.json';
window.wx = require('@/public/libs/weixin-1.0.0');
window.APP = require('@/public/libs/APP');
window.Share = require('@/public/libs/share');
import '@/public/style/reset.css';
Vue.use(vueTap);
Vue.config.productionTip = false;
const App = require(`@/page/dialog.vue`);
new Vue({
el: "#app",
render: h => h(App)
});
但如果,我想要根據配置來設定需要引入的vue文件,就會把以上page目錄下面的所有vue都打包
import Vue from 'vue'
import vueTap from 'v-tap';
import $ from '@/public/libs/zepto.min';
import pkg from '../package.json';
window.wx = require('@/public/libs/weixin-1.0.0');
window.APP = require('@/public/libs/APP');
window.Share = require('@/public/libs/share');
import '@/public/style/reset.css';
Vue.use(vueTap);
Vue.config.productionTip = false;
var templateName = pkg.template;
const App = require(`@/page/${templateName}.vue`);
new Vue({
el: "#app",
render: h => h(App)
});
不同之處在:
const App = require(@/page/${templateName}.vue
);
和
const App = require(@ /page/dialog.vue
);
目的:根據我的配置,每次打包的時候只打包配置的vue文件,不要所有的vue都打包進來
漂亮男人2017-06-30 09:54:21
動態依賴在編譯時完全無法確定依賴關係,所以 webpack 會嘗試將所有可能引用到的 module 進行打包,以確保運行時正常。
依照配置打包提供兩個思路
將配置寫成環境變量,而不是程式變數。
透過多入口的形式來實現。