- webpack概述
- 入口起点(Entry Points)
- 输出(Output)
- 模块(Mode)
- 加载器(Loaders)
- 插件(Plugins)
- 配置(Configuration)
- 模块(Modules)
- 模块解析(Module Resolution)
- 依赖图表(Dependency Graph)
- 文件清单(Manifest)
- 构建目标(Targets)
- 模块热替换(Hot Module Replacement)
- 第二部分:配置
- 使用不同语言进行配置(Configuration Languages)
- 多种配置类型
- 入口和上下文(Entry and Context)
- 输出(Output)
- 模块(Module)
- 解析(Resolve)
- 插件(Plugins)
- 开发中 Server(DevServer)
- 开发工具(Devtool)
- 构建目标(Targets)
- Watch 和 WatchOptions
- 外部扩展(Externals)
- 性能(Performance)
- Node
- 统计(Stats)
- 其它选项(Other Options)
- 第三部分:API
- 命令行接口(CLI)
- 包含统计数据的文件(stats data)
- Node.js API
- 模块热替换(Hot Module Replacement)
- 加载器 API
- 模块方法(module methods)
- 模块变量(module variables)
- Plugin API
- compiler 钩子
- compilation 钩子
- resolver
- parser
- 第四部分:指南
- 安装
- 起步
- 管理资源
- 管理输出
- 开发
- 模块热替换
- Tree shaking
- 生产环境构建
- 代码拆分(Code Splitting)
- 懒加载(Lazy Loading)
- 缓存(Caching)
- 创建库 (Library)
- Shimming
- 渐进式网络应用程序
- TypeScript
- 迁移到新版本
- 使用环境变量
- 构建性能
- 内容安全策略
- 开发 - Vagrant
- 管理依赖
- Public Path(公共路径)
- 集成(Integrations)
- 第五部分:加载器
- babel-loader
- yaml-frontmatter-loader
- cache-loader
- coffee-loader
- coffee-redux-loader
- coverjs-loader
- css-loader
- exports-loader
- expose-loader
- extract-loader
- file-loader
- gzip-loader
- html-loader
- i18n-loader
- imports-loader
- istanbul-instrumenter-loader
- jshint-loader
- json-loader
- json5-loader
- less-loader
- bundle-loader
- multi-loader
- node-loader
- null-loader
- polymer-webpack-loader
- postcss-loader
- raw-loader
- react-proxy-loader
- restyle-loader
- sass-loader
- script-loader
- source-map-loader
- style-loader
- svg-inline-loader
- thread-loader
- transform-loader
- url-loader
- val-loader
- worker-loader
- mocha-loader
- 第六部分:插件
- AggressiveSplittingPlugin
- ZopfliWebpackPlugin
- BannerPlugin
- ClosureWebpackPlugin
- CommonsChunkPlugin
- ComponentWebpackPlugin
- CompressionWebpackPlugin
- ContextReplacementPlugin
- CopyWebpackPlugin
- DefinePlugin
- DllPlugin
- EnvironmentPlugin
- EvalSourceMapDevToolPlugin
- ExtractTextWebpackPlugin
- HashedModuleIdsPlugin
- HotModuleReplacementPlugin
- HtmlWebpackPlugin
- BabelMinifyWebpackPlugin
- IgnorePlugin
- LoaderOptionsPlugin
- MinChunkSizePlugin
- ModuleConcatenationPlugin
- NamedModulesPlugin
- NormalModuleReplacementPlugin
- NpmInstallWebpackPlugin
- PrefetchPlugin
- ProfilingPlugin
- ProvidePlugin
- SourceMapDevToolPlugin
- SplitChunksPlugin
- UglifyjsWebpackPlugin
- WatchIgnorePlugin
- I18nWebpackPlugin
Node
这些选项可以配置是否 polyfill 或 mock 某些 Node.js 全局变量和模块。这可以使最初为 Node.js 环境编写的代码,在其他环境(如浏览器)中运行。
此功能由 webpack 内部的 NodeStuffPlugin
插件提供。如果 target 是 "web"(默认)或 "webworker",那么 NodeSourcePlugin
插件也会被激活。
node
object
是一个对象,其中每个属性都是 Node.js 全局变量或模块的名称,每个 value 是以下其中之一……
true
:提供 polyfill。"mock"
:提供 mock 实现预期接口,但功能很少或没有。"empty"
:提供空对象。false
: 什么都不提供。预期获取此对象的代码,可能会因为获取不到此对象,触发ReferenceError
而崩溃。尝试使用require('modulename')
导入模块的代码,可能会触发Cannot find module "modulename"
错误。
W> 注意,不是每个 Node 全局变量都支持所有选项。对于不支持的键值组合(property-value combination),compiler 会抛出错误。更多细节请查看接下来的章节。
这里是默认值:
node: {
console: false,
global: true,
process: true,
__filename: "mock",
__dirname: "mock",
Buffer: true,
setImmediate: true
// 更多选项,请查看“其他 Node.js 核心库”
}
从 webpack 3.0.0 开始,node
选项可能被设置为 false
,以完全关闭 NodeStuffPlugin
和 NodeSourcePlugin
插件。
node.console
boolean | "mock"
默认值:false
浏览器提供一个 console
对象,具有非常类似 Node.js console
的接口,所以通常不需要 polyfill。
node.process
boolean | "mock"
默认值:true
node.global
boolean
默认值:true
关于此对象的准确行为,请查看源码。
node.__filename
boolean | "mock"
默认值:"mock"
选项:
true
: 输入文件的文件名,是相对于context
选项。false
: 常规的 Node.js__filename
行为。在 Node.js 环境中运行时,输出文件的文件名。"mock"
: value 填充为"index.js"
.
node.__dirname
boolean | "mock"
默认值:"mock"
选项:
true
: 输入文件的目录名,是相对于context
选项。false
: 常规的 Node.js__dirname
行为。在 Node.js 环境中运行时,输出文件的目录名。"mock"
: value 填充为"/"
。
node.Buffer
boolean | "mock"
默认值:true
node.setImmediate
boolean | "mock" | "empty"
默认值:true
其他 Node.js 核心库(Node.js core libraries)
boolean | "mock" | "empty"
W> 只有当 target 是未指定、"web" 或 "webworker" 这三种情况时,此选项才会被激活(通过 NodeSourcePlugin
)。
当 NodeSourcePlugin
插件启用时,则会使用 node-libs-browser
来对 Node.js 核心库 polyfill。请查看 Node.js 核心库及其 polyfills 列表。
默认情况下,如果有一个已知的 polyfill,webpack 会对每个 library 进行 polyfill,如果没有,则 webpack 不会执行任何操作。在后一种情况下,如果模块名称配置为 false
值,webpack 表现为不会执行任何操作。
T> 为了导入内置的模块,使用 __non_webpack_require__
,例如,使用 __non_webpack_require__('modulename')
而不是 require('modulename')
。
示例:
node: {
dns: "mock",
fs: "empty",
path: true,
url: false
}
如果你对这篇内容有疑问,欢迎到本站社区发帖提问 参与讨论,获取更多帮助,或者扫码二维码加入 Web 技术交流群。
绑定邮箱获取回复消息
由于您还没有绑定你的真实邮箱,如果其他用户或者作者回复了您的评论,将不能在第一时间通知您!
发布评论