docs(cn): improve translations of guides/output-management

src/content/guides/output-management.mdx

@@ -10,20 +10,20 @@ contributors:
   - AnayaDesign
   - chenxsan
   - snitin315
-  - Yucohny
 translators:
   - QC-L
   - jacob-lcs
   - dear-lizhihua
+  - Yucohny
 ---
 
 T> 本指南继续沿用 [`管理资源`](/guides/asset-management) 指南中的代码示例。
 
-到目前为止，我们都是在 `index.html` 文件中手动引入所有资源，然而随着应用程序的不断增长，一旦开始 [使用哈希值进行文件命名](/guides/caching) 并输出 [多个 bundle](/guides/code-splitting)，手动管理 `index.html` 文件将变得困难。然而，使用一些插件可以让这个过程更容易管理。
+目前为止，都是在 `index.html` 文件中手动引入所有资源，然而随着应用程序的不断增长，一旦开始 [使用哈希值进行文件命名](/guides/caching) 并输出 [多个 bundle](/guides/code-splitting)，手动管理 `index.html` 文件将变得困难。使用一些插件可以更容易管理这个过程。
 
 ## 预先准备 $#preparation$
 
-首先，调整一下我们的项目：
+首先调整一下项目结构：
 
 **project**
 
@@ -39,7 +39,7 @@ T> 本指南继续沿用 [`管理资源`](/guides/asset-management) 指南中的
   |- /node_modules
 ```
 
-我们在 `src/print.js` 文件中添加一些逻辑：
+在 `src/print.js` 文件中添加一些逻辑：
 
 **src/print.js**
 
@@ -49,7 +49,7 @@ export default function printMe() {
 }
 ```
 
-并且在 `src/index.js` 文件中使用这个函数：
+并在 `src/index.js` 文件中使用这个函数：
 
 **src/index.js**
 
@@ -74,7 +74,7 @@ export default function printMe() {
  document.body.appendChild(component());
 ```
 
-还要更新 `dist/index.html` 文件，为 webpack 分离入口文件做好准备：
+更新 `dist/index.html` 文件，为 webpack 分离入口文件做准备：
 
 **dist/index.html**
 
@@ -94,7 +94,7 @@ export default function printMe() {
  </html>
 ```
 
-接下来调整配置。我们将在 entry 添加 `src/print.js` 作为新的入口起点（`print`），然后修改 output，使得根据入口起点定义的名称，动态生成 bundle 名称：
+接下来调整配置：在 entry 添加 `src/print.js` 作为新的入口起点（命名为 `print`），然后修改 output 使得能够根据入口起点定义的名称动态生成 bundle 名称：
 
 **webpack.config.js**
 
@@ -115,7 +115,7 @@ export default function printMe() {
  };
 ```
 
-执行 `npm run build`，然后看到输出如下：
+执行 `npm run build` 将看到输出如下：
 
 ```bash
 ...
@@ -130,13 +130,13 @@ cacheable modules 530 KiB
 webpack 5.4.0 compiled successfully in 1996 ms
 ```
 
-可以看到，webpack 将会生成 `print.bundle.js` 和 `index.bundle.js` 文件，这也和我们在 `index.html` 文件中指定的文件名称相对应。试试在浏览器中打开 `index.html`，看看点击按钮时会发生什么。
+可以看到，webpack 将会生成 `print.bundle.js` 与 `index.bundle.js` 文件，即与在 `index.html` 文件中指定的文件名称相对应。试试在浏览器中打开 `index.html`，看看点击按钮时会发生什么。
 
-但是，如果更改入口起点的名称，或者添加一个新的入口，那么会在构建时重新命名生成的 bundle，但是 `index.html` 仍然在引用旧的名称！我们可以使用 [`HtmlWebpackPlugin`](/plugins/html-webpack-plugin) 来解决这个问题。
+如果更改入口起点的名称，或者添加一个新的入口起点，那么会在构建时重新命名生成的 bundle，而 `index.html` 仍然在引用旧的名称。使用 [`HtmlWebpackPlugin`](/plugins/html-webpack-plugin) 插件可以解决这个问题。
 
 ## 设置 HtmlWebpackPlugin $#setting-up-htmlwebpackplugin$
 
-首先安装插件，并且调整 `webpack.config.js` 文件：
+安装插件并且调整 `webpack.config.js` 文件：
 
 ```bash
 npm install --save-dev html-webpack-plugin
@@ -165,7 +165,7 @@ npm install --save-dev html-webpack-plugin
  };
 ```
 
-在执行构建之前，你应该了解，虽然在 `dist/` 文件夹我们已经有了 `index.html` 这个文件，但是 `HtmlWebpackPlugin` 还是会默认生成它自己的 `index.html` 文件。换言之，它会用新生成的 `index.html` 文件，替换原有文件。看看执行 `npm run build` 后会发生什么：
+需要注意，在执行构建之前，虽然在 `dist/` 文件夹已经有了自定义的 `index.html` 文件，但是 `HtmlWebpackPlugin` 插件仍然会默认生成 `index.html` 文件，即使用新生成的 `index.html` 文件替换原有文件。观察执行 `npm run build` 后会发生什么：
 
 ```bash
 ...
@@ -181,15 +181,15 @@ cacheable modules 530 KiB
 webpack 5.4.0 compiled successfully in 2189 ms
 ```
 
-如果在代码编辑器中打开 `index.html`，会看到 `HtmlWebpackPlugin` 创建了一个全新的文件，所有的 bundle 都自动添加到其中。
+代码编辑器中打开 `index.html` 会发现 `HtmlWebpackPlugin` 创建了一个全新的文件，而所有的 bundle 都已自动添加到其中。
 
-如果想要了解 `HtmlWebpackPlugin` 插件提供的全部的功能和选项，请阅读 [`HtmlWebpackPlugin`](https://github.com/jantimon/html-webpack-plugin) 仓库中的源码。
+参阅 [`HtmlWebpackPlugin`](https://github.com/jantimon/html-webpack-plugin) 仓库源码以了解 `HtmlWebpackPlugin` 插件提供的全部功能。
 
 ## 清理 `/dist` 文件夹 $#cleaning-up-the-dist-folder$
 
-你可能已经注意到，由于遗留了之前的指南的代码示例，`/dist` 文件夹显得相当杂乱。webpack 将生成文件并放置在 `/dist` 文件夹中，但是它不会追踪哪些文件是实际在项目中用到的。
+可能已经注意到，由于遗留了之前的指南的代码示例，`/dist` 文件夹已经变得相当杂乱。webpack 生成文件并将其默认放置在 `/dist` 文件夹中，但是它不会追踪哪些文件是实际在项目中需要的。
 
-通常比较推荐的做法是，在每次构建前清理 `/dist` 文件夹，这样只会生成用到的文件。可以使用 [`output.clean`](/configuration/output/#outputclean) 配置项实现这个需求。
+通常比较推荐的做法是在每次构建前清理 `/dist` 文件夹，那么构建后就只会存在将要用到的文件。可以使用 [`output.clean`](/configuration/output/#outputclean) 配置选项实现这个需求。
 
 **webpack.config.js**
 
@@ -215,16 +215,16 @@ webpack 5.4.0 compiled successfully in 2189 ms
  };
 ```
 
-现在，执行 `npm run build` 后检查 `/dist` 文件夹。如果一切顺利，现在只会看到构建后生成的文件，而没有旧文件！
+再次执行 `npm run build` 后检查 `/dist` 文件夹。如果一切顺利，现在只会看到构建后生成的文件，而没有旧文件！
 
 ## manifest $#the-manifest$
 
-你可能会很感兴趣，webpack 和 webpack 插件似乎“知道”应该生成哪些文件 —— webpack 通过 manifest 追踪所有模块到输出 bundle 之间的映射。如果你想要知道如何以其他方式来控制 webpack [`输出`](/configuration/output)，了解 manifest 是个好的开始。
+你可能会对 webpack 和 webpack 插件似乎“知道”应该生成哪些文件感兴趣。webpack 通过 manifest 追踪所有模块到输出的 bundle 之间的映射。了解 manifest 将会帮助了解如何以其他方式控制 webpack [`输出`](/configuration/output)。
 
-[`WebpackManifestPlugin`](https://github.com/shellscape/webpack-manifest-plugin) 插件可以将 manifest 数据提取为一个 json 文件以供使用。
+[`WebpackManifestPlugin`](https://github.com/shellscape/webpack-manifest-plugin) 插件可以将 manifest 数据提取为 json 文件。
 
-我们不会在此展示如何在项目中使用此插件，你可以在 [manifest](/concepts/manifest) 概念页面深入阅读，以及在 [缓存](/guides/caching) 指南中了解它与长效缓存有何关系。
+参阅 [manifest](/concepts/manifest) 概念页面以深入了解如何在项目中使用此插件，同时 [缓存](/guides/caching) 指南介绍了其与长效缓存之间的关系。
 
 ## 总结 $#conclusion$
 
-现在，你已经了解如何向 HTML 动态添加 bundle，让我们深入 [开发环境](/guides/development) 指南。或者如果你想要深入更多相关高级话题，我们推荐你前往 [代码分离](/guides/code-splitting) 指南。
+现在已经了解如何向 HTML 动态添加 bundle，接下来继续深入 [开发环境](/guides/development) 指南。如果想要深入更多相关高级话题，那么推荐前往 [代码分离](/guides/code-splitting) 指南。