javascript - webpack打包 会把一个目录下面的所有文件都打包
问题描述
如果用下面的方式配置,引入的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都都打包进来
问题解答
回答1:动态依赖在编译时完全无法确定依赖关系,所以 webpack 会尝试将所有可能引用到的 module 进行打包,以保证运行时正常。
按照配置打包提供两个思路
将配置写成环境变量,而不是程序变量。
通过多入口的形式来实现。
相关文章:
1. mysql - sql 语句更改表结构,添加多个列,怎么写?2. javascript - vue中父组件向子组件传递Object时,如何避免TypeError?3. angular.js - 在移动端web上如何解决输入法挡住文本框问题?4. javascript - 怎么设计项目的返回码,让不同的返回码代表不同的含义?5. javascript - svg小白,想要在svg里面插入图片6. android-studio - Android Studio 2.2 beta2 更新后强制将 Gradle 版本升级为 2.14.1,有没有遇到同样情况的?7. python - 关于django 模板中循环列表8. css3 怎么实现锯齿状的剪纸效果(如图)9. html5 - 如何利用Canvas技术制作出上下跳动的音乐谱10. mac连接阿里云docker集群,已经卡了2天了,求问?