Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Merge branch 'master' into cn #350

Merged
merged 9 commits into from
Aug 10, 2017
2 changes: 1 addition & 1 deletion content/configuration/dev-server.md
Original file line number Diff line number Diff line change
Expand Up @@ -295,7 +295,7 @@ webpack-dev-server --host 0.0.0.0
hot: true
```

T> Note that you must also include a `new webpack.HotModuleReplacementPlugin()` to fully enable HMR. See the [HMR concepts page](/concepts/hot-module-replacement) for more information.
T> Note that `webpack.HotModuleReplacementPlugin` is required to fully enable HMR. If `webpack` or `webpack-dev-server` are launched with the `--hot` option, this plugin will be added automatically, so you may not need to add this to your `webpack.config.js`. See the [HMR concepts page](/concepts/hot-module-replacement) for more information.


## `devServer.hotOnly`
Expand Down
2 changes: 1 addition & 1 deletion content/configuration/externals.md
Original file line number Diff line number Diff line change
Expand Up @@ -48,7 +48,7 @@ $('.my-element').animate(...);

具有外部依赖(external dependency)的 bundle 可以在各种模块上下文(module context)中使用,例如 [CommonJS, AMD, 全局变量和 ES2015 模块](/concepts/modules)。外部 library 可能是以下任何一种形式:

* __global__ - 外部 library 能够作为全局变量使用。用户可以通过在 script 标签中引入来实现。这是 externals 的默认设置。
* __root__ - 外部 library 能够作为全局变量使用。用户可以通过在 script 标签中引入来实现。这是 externals 的默认设置。
* __commonjs__ - 用户(consumer)应用程序可能使用 CommonJS 模块系统,因此外部 library 应该使用 CommonJS 模块系统,并且应该是一个 CommonJS 模块。
* __commonjs2__ - 类似上面几行,但导出的是 `module.exports.default`。
* __amd__ - 类似上面几行,但使用 AMD 模块系统。
Expand Down
11 changes: 8 additions & 3 deletions content/configuration/module.md
Original file line number Diff line number Diff line change
Expand Up @@ -145,7 +145,7 @@ W> 由于需要支持 `Rule.use`,此选项__已废弃__。
resourceQuery: /external/, // foo.css?external
use: 'file-loader'
}
]
]
}
```

Expand All @@ -158,9 +158,14 @@ W> 由于需要支持 `Rule.options` 和 `UseEntry.options`,`Rule.use`,`Rule

## `Rule.parser`

解析选项对象。所有应用的解析选项被合并。
解析选项对象。所有应用的解析选项都将合并。

解析器(parser)可以查阅这些选项,并相应地禁用或重新配置。大多数默认插件,会如下解释值:

* 将选项设置为 `false`,将禁用解析器。
* 将选项设置为 `true`,或不修改将其保留为 `undefined`,可以启用解析器。

为每个不同的解析器选项对象,创建新的解析器,并且插件可以应用在那些依赖解析器选项的插件。许多默认插件,仅在解析器选项属性未设置或为 true 时,应用解析器插件
然而,一些解析器(parser)插件可能不光只接收一个布尔值。例如,内部的 `NodeStuffPlugin` 差距,可以接收一个对象,而不是 `true`,来为特定的规则添加额外的选项

**示例**(默认的插件解析器选项):

Expand Down
21 changes: 15 additions & 6 deletions content/configuration/node.md
Original file line number Diff line number Diff line change
Expand Up @@ -5,9 +5,12 @@ contributors:
- sokra
- skipjack
- oneforwonder
- Rob--W
---

这些选项可以配置是否 polyfill 或 mock 某些 [Node.js 全局变量](https://nodejs.org/docs/latest/api/globals.html)和模块。这可以使最初为 Node.js 环境编写的代码,在其他环境(如浏览器)中运行。此功能由 webpack 内部的 [`NodeStuffPlugin`](https://github.com/webpack/webpack/blob/master/lib/NodeStuffPlugin.js) 提供。
这些选项可以配置是否 polyfill 或 mock 某些 [Node.js 全局变量](https://nodejs.org/docs/latest/api/globals.html)和模块。这可以使最初为 Node.js 环境编写的代码,在其他环境(如浏览器)中运行。

此功能由 webpack 内部的 [`NodeStuffPlugin`](https://github.com/webpack/webpack/blob/master/lib/NodeStuffPlugin.js) 插件提供。如果 target 是 "web"(默认)或 "webworker",那么 [`NodeSourcePlugin`](https://github.com/webpack/webpack/blob/master/lib/node/NodeSourcePlugin.js) 插件也会被激活。


## `node`
Expand All @@ -19,7 +22,7 @@ contributors:
- `true`:提供 polyfill。
- `"mock"`:提供 mock 实现预期接口,但功能很少或没有。
- `"empty"`:提供空对象。
- `false`什么都不提供。代码中预期的此对象,可能会因为未定义而导致崩溃
- `false`: 什么都不提供。预期获取此对象的代码,可能会因为获取不到此对象,触发 `ReferenceError` 而崩溃。尝试使用 `require('modulename')` 导入模块的代码,可能会触发 `Cannot find module "modulename"` 错误

W> 注意,不是每个 Node 全局变量都支持所有选项。对于不支持的键值组合(property-value combination),compiler 会抛出错误。更多细节请查看接下来的章节。

Expand All @@ -34,10 +37,12 @@ node: {
__dirname: "mock",
Buffer: true,
setImmediate: true

// 更多选项,请查看“其他 Node.js 核心库”
}
```

从 webpack 3.0.0 开始,`node` 选项可能会被设置为 `false` 以完全关闭 `NodeSourcePlugin`。
从 webpack 3.0.0 开始,`node` 选项可能被设置为 `false`以完全关闭 `NodeSourcePlugin` 和 `NodeSourcePlugin` 插件


## `node.console`
Expand Down Expand Up @@ -109,9 +114,13 @@ node: {

`boolean | "mock" | "empty"`

还可以配置许多其他 Node.js 核心库。查看 [Node.js 核心库和它们的 polyfill](https://github.com/webpack/node-libs-browser)
W> 只有当 target 是未指定、"web" 或 "webworker" 这三种情况时,此选项才会被激活(通过 `NodeSourcePlugin`)。

当 `NodeSourcePlugin` 插件启用时,则会使用 [`node-libs-browser`](https://github.com/webpack/node-libs-browser) 来对 Node.js 核心库 polyfill。请查看 [Node.js 核心库及其 polyfills](https://github.com/webpack/node-libs-browser#readme) 列表。

默认情况下,如果有一个已知的 polyfill,webpack 会对每个 library 进行 polyfill,如果没有,则 webpack 不会执行任何操作。在后一种情况下,如果模块名称配置为 `false` 值,webpack 表现为不会执行任何操作。

默认情况下,如果有一个明显的 polyfill,webpack 会对每个 library 进行 polyfill,如果没有,则 webpack 不会执行任何操作
T> 为了导入内置的模块,使用 [`__non_webpack_require__`](/api/module-variables/#__non_webpack_require__-webpack-specific-),例如,使用 `__non_webpack_require__('modulename')` 而不是 `require('modulename')`

示例:

Expand All @@ -126,4 +135,4 @@ node: {

***

> 原文:https://webpack.js.org/configuration/node/
> 原文:https://webpack.js.org/configuration/node/
13 changes: 8 additions & 5 deletions content/configuration/output.md
Original file line number Diff line number Diff line change
Expand Up @@ -200,14 +200,12 @@ filename: "[chunkhash].bundle.js"

可以使用以下替换模板字符串(通过 webpack 内部的[`TemplatedPathPlugin`][`TemplatedPathPlugin`](https://github.com/webpack/webpack/blob/master/lib/TemplatedPathPlugin.js)):

| Template | Description |
| ----------- | ----------- |
| 模板 | 描述 |
| ----------- | ----------------------------------------------------------------------------------- |
| [hash] | 模块标识符(module identifier)的 hash |
| [chunkhash] | chunk 内容的 hash |
| [name] | 模块名称 |
| [id] | 模块标识符(module identifier) |
| [file] | 模块文件名称 |
| [filebase] | 模块 [basename](https://nodejs.org/api/path.html#path_path_basename_path_ext) |
| [query] | 模块的 query,例如,文件名 `?` 后面的字符串 |

`[hash]` 和 `[chunkhash]` 的长度可以使用 `[hash:16]`(默认为20)来指定。或者,通过指定[`output.hashDigestLength`](#output-hashdigestlength) 在全局配置长度。
Expand Down Expand Up @@ -617,7 +615,12 @@ publicPath: "", // 相对于 HTML 页面(目录相同)

配置 source map 的命名方式。默认使用 `"[file].map"`。

技术上看,对于 chunk 生成的 SourceMap,可以使用 `[name]`, `[id]`, `[hash]` 和 `[chunkhash]` [占位符(placeholder)](#output-filename)。除了替换这些占位符,`[file]` 占位符还可以被替换为原始文件(original file)的文件名。建议只使用 `[file]` 占位符,因为其他占位符在非 chunk 文件生成的 SourceMap 时不起作用。最好保持默认。
可以使用 [#output-filename](#output-filename) 中的 `[name]`, `[id]`, `[hash]` 和 `[chunkhash]` 替换符号。除此之外,还可以使用以下替换符号。`[file]` 占位符会被替换为原始文件的文件名。我们建议__只使用 `[file]` 占位符__,因为其他占位符在非 chunk 文件(non-chunk files)生成的 SourceMap 时不起作用。

| 模板 | 描述 |
| -------------------------- | ----------------------------------------------------------------------------------- |
| [file] | 模块文件名称 |
| [filebase] | 模块 [basename](https://nodejs.org/api/path.html#path_path_basename_path_ext) |


## `output.sourcePrefix`
Expand Down
8 changes: 1 addition & 7 deletions content/development/plugin-patterns.md
Original file line number Diff line number Diff line change
Expand Up @@ -40,13 +40,9 @@ module.exports = MyPlugin;
```

- `compilation.modules`: 一个存放编译中涉及的模块(构建时的输入)的数组。每个模块处理了你源码库中的一个原始文件的构建。

- `module.fileDependencies`: 一个存放模块中包含的源文件路径的数组。它包含了 JavaScript 源文件自身(例如:`index.js`),和所有被请求(required)的依赖资源文件(样式表,图像等等)。想要知道哪些源文件属于这个模块时,检查这些依赖是有帮助的。

- `compilation.chunks`: 一个存放编译中涉及的块(构建后的输出)的数组。每个块处理了一个最终输出资源的组合。

- `chunk.modules`: 一个存放块中包含的模块的数组。为了扩展,你也许需要查阅每个模块的依赖来得知哪些源文件注入到了块中。

- `chunk.files`: 一个存放了块生成的输出文件的文件名的数组。你也许需要从 `compilation.assets` 中访问这些资源内容。

### 监控跟踪图(watch graph)
Expand Down Expand Up @@ -74,9 +70,7 @@ MyPlugin.prototype.apply = function(compiler) {
module.exports = MyPlugin;
```

你也可以补充新的文件路径到跟踪图(graph)里,来接收在编译中这些文件变化时的回调触发。简单地 push 有效的文件路径到 `compilation.fileDependencies` 数组就可以把它们加入跟踪。

注意:`fileDependencies` 数组在每次编译中会被重新建立,所以你的插件必须在每次编译时向当时所属的数组 push 来保证它们能被跟踪到。
你也可以补充新的文件路径到跟踪图(graph)里,来接收在编译中这些文件变化时的回调触发。简单地 push 有效的文件路径到 `compilation.fileDependencies` 数组就可以把它们加入跟踪。注意:`fileDependencies` 数组在每次编译中会被重新建立,所以你的插件必须在每次编译时向当时所属的数组 push 来保证它们能被跟踪到。

## 变化的块

Expand Down
3 changes: 2 additions & 1 deletion content/guides/code-splitting.md
Original file line number Diff line number Diff line change
Expand Up @@ -20,6 +20,7 @@ contributors:
- TheDutchCoder
- rouzbeh84
- shaodahong
- sudarsangp
---

T> 本指南扩展了[起步](/guides/getting-started)和[管理构建文件](/guides/output-management)中提供的示例。请确保您至少已熟悉其中提供的示例。
Expand Down Expand Up @@ -203,7 +204,7 @@ __webpack.config.js__
};
```

We'll also update our project to remove the now unused files:
Note the use of `chunkFilename`, which determines the name of non-entry chunk files. For more information on `chunkFilename`, see [output documentation](/configuration/output/#output-chunkfilename). We'll also update our project to remove the now unused files:

__project__

Expand Down
4 changes: 2 additions & 2 deletions content/plugins/context-replacement-plugin.md
Original file line number Diff line number Diff line change
Expand Up @@ -3,8 +3,8 @@ title: ContextReplacementPlugin
contributors:
- simon04
related:
- title: Issue #2783 - ContextReplacementPlugin Description
- url: https://github.com/webpack/webpack/issues/2783#issuecomment-234137265
- title: Issue 2783 - ContextReplacementPlugin Description
url: https://github.com/webpack/webpack/issues/2783#issuecomment-234137265
---

*上下文(Context)* 与一个[带表达式的 require 语句](/guides/dependency-management/#require-with-expression) 相关,例如 `require('./locale/' + name + '.json')`。遇见此类表达式时,webpack 查找目录 (`'./locale/'`) 下符合正则表达式 (`/^.*\.json$/`)的文件。由于 `name` 在编译时(compile time)还是未知的,webpack 会将每个文件都作为模块引入到 bundle 中。
Expand Down
1 change: 0 additions & 1 deletion styles/markdown.scss
Original file line number Diff line number Diff line change
Expand Up @@ -313,7 +313,6 @@

p {
code, tt {
display: inline-block;
max-width: 100%;
line-height: initial;
overflow: auto;
Expand Down
Loading