返回

webpack之external配置

Created By ZOU on Mar 05 2020

当我们在项目内引入Jquery或者Vue的CDN链接时,在项目内怎么去使用呢?通常可能通过window对象去调用,但是我们还可以通过另一种方法,就是通过external选项。

例如我们引入了Vue的CDN外部链接。

<script src="https://cdn.bootcss.com/vue/2.6.11/vue.js"></script>

在项目里使用vue

import Vue from 'vue'
new Vue({ ... }).$mount('#app')

在webpack配置中加入

// webpack.config.js
module.exports = {
// ....
external: {
// 前者为引入的vue,后者为全局变量Vue
vue: 'Vue'
}
}

这样即可,在打包项目时vue模块也不会参与打包,引入的vue模块会替换成window.Vue

标签: javascript webpack