【webpack】中externals的作用

 externals 用於排除一些引入的模塊，不進行打包，引用外部的模塊。

 

通常，我們這樣引入vue模塊

import vue from 'vue'

 

但是我們映入了CDN就不要再打包這個模塊了，所以通過 externals 來排除這個模塊

externals: {
  vue: 'vue'
}

 

值得注意的是屬性名和屬性值表示什么意思，屬性名是你代碼引入的名字，屬性值是打包之后要引入的名字，具體什么意思呢，就是

assets/js/index.js 打包前引的是這個路徑
assets/lib/js/index.js 打包后引的是這個路徑

 

配置

externals: {
  'assets/js/index.js': 'assets/lib/js/index.js'
}