外部环境 | Externals
externals 配置选项提供了「从输出的 bundle 中排除依赖」的方法。相反，所创建的 bundle 依赖于那些存在于用户环境(consumer's environment)中的依赖。此功能通常对 __library 开发人员__来说是最有用的，然而也会有各种各样的应用程序用到它。
用户(consumer)，在这里是指，引用了「使用 webpack 打包的 library」的所有终端用户的应用程序(end user application)。
externals
string array object function regex
防止将某些 import 的包 ( package ) 打包到 bundle 中，而是在运行时 (runtime ) 再去从外部获取这些扩展依赖 ( external dependencies )。
例如，从 CDN 引入 jQuery，而不是把它打包：
index.html
...
<script src="https://code.jquery.com/jquery-3.1.0.js"
integrity="sha256-slogkvB1K3VOkzAI8QITxV3VzpOnkeNVsKvtkYLMjfk="
crossorigin="anonymous"></script>
...webpack.config.js
externals: {
jquery: 'jQuery'
}这样就剥离了那些不需要改动的依赖模块，换句话，下面展示的代码还可以正常运行：
import $ from 'jquery';
$('.my-element').animate(...);具有外部依赖(external dependency)的 bundle 可以在各种模块上下文(module context)中使用，例如 CommonJS, AMD, 全局变量和 ES2015 模块。外部 library 可能是以下任何一种形式：
- root：可以通过一个全局变量访问 library（例如，通过 script 标签）。
- commonjs：可以将 library 作为一个 CommonJS 模块访问。
- commonjs2：和上面的类似，但导出的是
module.exports.default.
- amd：类似于
commonjs，但使用 AMD 模块系统。
externals 接受各种语法并以不同的方式解释它们。
string
externals中的jQuery,表示你的包将需要访问全局形式的jQuery变量。
array
externals: {
subtract: ['./math', 'subtract']
}subtract: ['./math', 'subtract'] 转换为父子结构，其中 ./math 是父模块，而 bundle 只引用 subtract 变量下的子集。
object
externals : {
react: 'react'
}
// or
externals : {
lodash : {
commonjs: "lodash",
amd: "lodash",
root: "_" // indicates global variable
}
}
// or
externals : {
subtract : {
root: ["math", "subtract"]
}
}此语法用于描述外部 library 所有可用的访问方式。这里 lodash 这个外部 library 可以在 AMD 和 CommonJS 模块系统中通过 lodash 访问，但在全局变量形式下用 _ 访问。subtract 可以通过全局 math 对象下的属性 subtract 访问（例如 window['math']['subtract']）。
function
定义你自己的函数来控制从webpack中外化的行为可能是有用的。例如，webpack-node-externals 会从 node_modules 中排除所有模块，并向白名单包提供一些选项。
它基本上归结为以下：
externals: [
function(context, request, callback) {
if (/^yourregex$/.test(request)){
return callback(null, 'commonjs ' + request);
}
callback();
}
],'commonjs ' + request定义了需要被外部模块的类型。
regex
匹配给定正则表达式的每个依赖项都将从输出包中排除。
externals: /^(jquery|\$)$/i在这种情况下，任何名为jQuery的依赖项，大写或不是或$都将被外化。
有关如何使用此配置的更多信息，请参阅有关如何创建库的文章。
本文档系腾讯云开发者社区成员共同维护，如有问题请联系 cloudcommunity@tencent.com
