externals
配置选项提供了「从输出的 bundle 中排除依赖」的方法。相反,所创建的 bundle 依赖于那些存在于用户环境(consumer&aposs environment)中的依赖。此功能通常对 library 开发人员来说是最有用的,然而也会有各种各样的应用程序用到它。
T> 用户(consumer),在这里是指,引用了「使用 webpack 打包的 library」的所有终端用户的应用程序(end user application)。
externals
string
array
object
function
regex
防止将某些 import
的包(package)打包到 bundle 中,而是在运行时(runtime)再去从外部获取这些扩展依赖(external dependencies)。
例如,从 CDN 引入 jQuery,而不是把它打包:
index.html
------- --------------------------------------------- --------------------------------------------------------------- ------------------------ ---------
webpack.config.js
---------- - ------- -------- -
这样就剥离了那些不需要改动的依赖模块,换句话,下面展示的代码还可以正常运行:
------ - ---- -------- -----------------------------
具有外部依赖(external dependency)的 bundle 可以在各种模块上下文(module context)中使用,例如 CommonJS, AMD, 全局变量和 ES2015 模块。外部 library 可能是以下任何一种形式:
- root:可以通过一个全局变量访问 library(例如,通过 script 标签)。
- commonjs:可以将 library 作为一个 CommonJS 模块访问。
- commonjs2:和上面的类似,但导出的是
module.exports.default
. - amd:类似于
commonjs
,但使用 AMD 模块系统。
可以接受各种语法……
string
请查看上面的例子。属性名称是 jquery
,表示应该排除 import $ from &aposjquery&apos
中的 jquery
模块。为了替换这个模块,jQuery
的值将被用来检索一个全局的 jQuery
变量。换句话说,当设置为一个字符串时,它将被视为全局的
(定义在上面和下面)。
array
---------- - --------- ---------- ----------- -
subtract: [&apos./math&apos, &apossubtract&apos]
转换为父子结构,其中 ./math
是父模块,而 bundle 只引用 subtract
变量下的子集。
object
--------- - - ------ ------- - -- -- --------- - - ------ - - --------- --------- ---- --------- ----- --- -- ------ - - -- -- --------- - - -------- - - ----- -------- ----------- - -
此语法用于描述外部 library 所有可用的访问方式。这里 lodash
这个外部 library 可以在 AMD 和 CommonJS 模块系统中通过 lodash
访问,但在全局变量形式下用 _
访问。subtract
可以通过全局 math
对象下的属性 subtract
访问(例如 window[&aposmath&apos][&apossubtract&apos]
)。
function
It might be useful to define your own function to control the behavior of what you want to externalize from webpack. webpack-node-externals, for example, excludes all modules from the node_modules
directory and provides some options to, for example, whitelist packages.
It basically comes down to this:
---------- - ----------------- -------- --------- - -- ------------------------------ ------ -------------- --------- - - -------- - ---------- - --
The &aposcommonjs &apos + request
defines the type of module that needs to be externalized.
regex
Every dependency that matches the given regular expression will be excluded from the output bundles.
---------- ----------------
In this case any dependency named jQuery
, capitalized or not, or $
would be externalized.
关于如何使用此 externals 配置的更多信息,请参考如何编写 library。