Merge pull request #1522 from docschina/sync-2eb6c6ad

docs(en): merge webpack.js.org/master into webpack.js.org/cn @ 2eb6c6a

Author: jacob-lcs

.github/workflows/deploy.yml

@@ -15,10 +15,10 @@ jobs:
         node-version: [16.x]
     runs-on: ${{ matrix.os }}
     steps:
-      - uses: actions/checkout@v2
+      - uses: actions/checkout@v3
 
       - name: Use Node.js ${{ matrix.node-version }}
-        uses: actions/setup-node@v2
+        uses: actions/setup-node@v3
         with:
           node-version: ${{ matrix.node-version }}
           cache: yarn
@@ -31,7 +31,7 @@ jobs:
       - run: yarn lint:links
 
       - name: Deploy
-        uses: JamesIves/github-pages-deploy-action@4.1.8
+        uses: JamesIves/github-pages-deploy-action@v4.2.5
         with:
           token: ${{ secrets.GITHUB_TOKEN }}
           branch: gh-pages

.github/workflows/testing.yml

@@ -12,10 +12,10 @@ jobs:
         node-version: [16.x]
     runs-on: ${{ matrix.os }}
     steps:
-      - uses: actions/checkout@v2
+      - uses: actions/checkout@v3
 
       - name: Use Node.js ${{ matrix.node-version }}
-        uses: actions/setup-node@v2
+        uses: actions/setup-node@v3
         with:
           node-version: ${{ matrix.node-version }}
           cache: yarn
@@ -31,7 +31,7 @@ jobs:
         os: [ubuntu-latest]
     runs-on: ${{ matrix.os }}
     steps:
-      - uses: actions/checkout@v2
+      - uses: actions/checkout@v3
 
       - name: Vale
         uses: errata-ai/vale-action@v1.4.2
@@ -48,10 +48,10 @@ jobs:
         node-version: [16.x]
     runs-on: ${{ matrix.os }}
     steps:
-      - uses: actions/checkout@v2
+      - uses: actions/checkout@v3
 
       - name: Use Node.js ${{ matrix.node-version }}
-        uses: actions/setup-node@v2
+        uses: actions/setup-node@v3
         with:
           node-version: ${{ matrix.node-version }}
           cache: yarn
@@ -72,10 +72,10 @@ jobs:
         node-version: [16.x]
     runs-on: ${{ matrix.os }}
     steps:
-      - uses: actions/checkout@v2
+      - uses: actions/checkout@v3
 
       - name: Use Node.js ${{ matrix.node-version }}
-        uses: actions/setup-node@v2
+        uses: actions/setup-node@v3
         with:
           node-version: ${{ matrix.node-version }}
           cache: yarn

package.json

@@ -73,53 +73,54 @@
     ]
   },
   "devDependencies": {
-    "@babel/core": "^7.17.0",
+    "@babel/core": "^7.17.8",
     "@babel/eslint-parser": "^7.17.0",
     "@babel/plugin-proposal-class-properties": "^7.16.7",
     "@babel/preset-env": "^7.16.11",
     "@babel/preset-react": "^7.16.7",
     "@mdx-js/loader": "^2.0.0-next.9",
     "@octokit/auth-action": "^1.3.3",
     "@octokit/rest": "^18.12.0",
+    "@parcel/css": "^1.7.4",
     "@pmmmwh/react-refresh-webpack-plugin": "next",
     "@svgr/webpack": "^6.2.1",
-    "autoprefixer": "^10.4.2",
-    "babel-loader": "^8.2.3",
+    "autoprefixer": "^10.4.4",
+    "babel-loader": "^8.2.4",
     "copy-webpack-plugin": "^10.2.4",
-    "css-loader": "^6.6.0",
+    "css-loader": "^6.7.1",
     "css-minimizer-webpack-plugin": "^3.4.1",
-    "cypress": "^9.4.1",
-    "directory-tree": "^3.1.0",
+    "cypress": "^9.5.3",
+    "directory-tree": "^3.2.2",
     "directory-tree-webpack-plugin": "^1.0.3",
     "duplexer": "^0.1.1",
-    "eslint": "^8.8.0",
-    "eslint-config-prettier": "^8.3.0",
+    "eslint": "^8.12.0",
+    "eslint-config-prettier": "^8.5.0",
     "eslint-plugin-cypress": "^2.12.1",
-    "eslint-plugin-mdx": "^1.16.0",
-    "eslint-plugin-react": "^7.28.0",
-    "eslint-plugin-react-hooks": "^4.3.0",
+    "eslint-plugin-mdx": "^1.17.0",
+    "eslint-plugin-react": "^7.29.4",
+    "eslint-plugin-react-hooks": "^4.4.0",
     "front-matter": "^4.0.2",
-    "github-slugger": "^1.3.0",
+    "github-slugger": "^1.4.0",
     "html-loader": "^2.1.2",
     "html-webpack-plugin": "^5.5.0",
     "http-server": "^14.1.0",
     "husky": "^7.0.4",
     "hyperlink": "^5.0.4",
-    "jest": "^27.5.0",
-    "lint-staged": "^12.3.3",
+    "jest": "^27.5.1",
+    "lint-staged": "^12.3.7",
     "lodash": "^4.17.21",
     "markdownlint": "^0.25.1",
-    "markdownlint-cli": "^0.31.0",
-    "mdast-util-to-string": "^1.1.0",
-    "mini-css-extract-plugin": "^2.5.3",
+    "markdownlint-cli": "^0.31.1",
+    "mdast-util-to-string": "^3.1.0",
+    "mini-css-extract-plugin": "^2.6.0",
     "mkdirp": "^1.0.4",
     "modularscale-sass": "^3.0.3",
-    "node-fetch": "^3.2.0",
+    "node-fetch": "^3.2.3",
     "npm-run-all": "^4.1.1",
-    "postcss": "^8.4.6",
+    "postcss": "^8.4.12",
     "postcss-loader": "^6.2.1",
-    "prettier": "^2.5.1",
-    "react-refresh": "^0.11.0",
+    "prettier": "^2.6.1",
+    "react-refresh": "^0.12.0",
     "redirect-webpack-plugin": "^1.0.0",
     "remark": "^14.0.2",
     "remark-autolink-headings": "7.0.1",
@@ -129,42 +130,41 @@
     "remark-gfm": "^1.0.0",
     "remark-html": "^15.0.1",
     "remark-refractor": "montogeek/remark-refractor",
-    "remark-slug": "^7.0.1",
     "rimraf": "^3.0.2",
-    "sass": "^1.49.7",
-    "sass-loader": "^12.4.0",
+    "sass": "^1.49.10",
+    "sass-loader": "^12.6.0",
     "sirv-cli": "^2.0.2",
     "sitemap-static": "^0.4.2",
     "start-server-and-test": "^1.14.0",
     "static-site-generator-webpack-plugin": "^3.4.1",
     "style-loader": "^3.3.1",
-    "tailwindcss": "^3.0.18",
+    "tailwindcss": "^3.0.23",
     "tap-spot": "^1.1.1",
     "textlint": "^11.8.2",
     "textlint-rule-heading": "^1.0.10",
     "unist-util-visit": "^4.1.0",
-    "webpack": "^5.68.0",
+    "webpack": "^5.71.0",
     "webpack-bundle-analyzer": "^4.5.0",
     "webpack-cli": "^4.9.2",
     "webpack-dev-server": "^4.7.4",
     "webpack-merge": "^5.8.0",
-    "workbox-webpack-plugin": "^6.4.2"
+    "workbox-webpack-plugin": "^6.5.2"
   },
   "dependencies": {
     "@docsearch/react": "^3.0.0-alpha.50",
     "path-browserify": "^1.0.1",
     "prop-types": "^15.8.1",
     "react": "^17.0.2",
     "react-dom": "^17.0.2",
-    "react-helmet-async": "^1.2.2",
-    "react-router-dom": "^6.2.1",
-    "react-spring": "^9.4.2",
+    "react-helmet-async": "^1.2.3",
+    "react-router-dom": "^6.3.0",
+    "react-spring": "^9.4.4",
     "react-tiny-popover": "5",
     "react-use": "^17.3.2",
     "react-visibility-sensor": "^5.0.2",
     "webpack-pwa-manifest": "^4.3.0",
     "webpack.vote": "https://github.com/webpack/voting-app.git",
-    "workbox-window": "^6.4.2"
+    "workbox-window": "^6.5.2"
   },
   "resolutions": {
     "sitemap-static/minimist": "1.2.5",

src/components/Markdown/Markdown.scss

@@ -1,4 +1,4 @@
-@use "sass:color";
+@use 'sass:color';
 @import 'vars';
 @import 'functions';
 @import 'prism-theme';
@@ -41,15 +41,16 @@ $topHeightMobileWithBanner: $bannerHeight + $topHeightMobile;
   h4,
   h5,
   h6 {
-    &:before {
-      content: '';
+    > span[id] {
+      position: absolute;
+      width: 0;
       display: block;
       visibility: hidden;
       pointer-events: none;
-      height: $topHeightMobile;
+      padding-top: $topHeightMobile;
       margin-top: -#{$topHeightMobile};
       @include break {
-        height: $topHeightDesktop;
+        padding-top: $topHeightDesktop;
         margin-top: -#{$topHeightDesktop};
       }
     }

src/components/Page/Page.jsx

@@ -97,6 +97,15 @@ export default function Page(props) {
       <Markdown>
         <h1>{title}</h1>
 
+        {rest.thirdParty ? (
+          <div className="italic my-[20px]">
+            <strong className="font-bold">Disclaimer:</strong> {title} is a
+            third-party package maintained by community members, it potentially
+            does not have the same support, security policy or license as
+            webpack, and it is not maintained by webpack.
+          </div>
+        ) : null}
+
         {contentRender}
 
         {loadRelated && (

src/components/Site/Site.jsx

@@ -269,7 +269,7 @@ function Site(props) {
                 ),
               },
               { content: '参与贡献', url: '/contribute/' },
-              { content: '投票', url: 'https://v4.webpack.docschina.org/vote/' },
+              { content: '投票', url: 'https://webpack.js.org/vote/' },
               { content: '博客', url: '/blog/' },
               { content: '印记中文', url: 'https://docschina.org' },
             ]}

src/components/Support/Support.jsx

@@ -85,7 +85,7 @@ function formatMoney(number) {
   let str = Math.round(number) + '';
 
   if (str.length > 3) {
-    str = str.substr(0, str.length - 3) + ',' + str.substr(-3);
+    str = str.slice(0, -3) + ',' + str.slice(-3);
   }
   return str;
 }

src/content/api/cli.mdx

@@ -101,7 +101,7 @@ npx webpack init ./my-app --force --template=default
 
 `boolean`
 
-生成项目时不启用选项模式。当为 `true` 时，所有命令行选项使用默认值。
+不输入配置项就生成一个项目。该配置启用时所有命令行配置项将使用默认值。
 
 T> 点击 [这里](https://github.com/webpack/webpack-cli/blob/master/packages/generators/INIT.md) 获取 `webpack init` 命令的完整文档。
 
@@ -583,7 +583,7 @@ T> 请查阅 [environment 变量指南](/guides/environment-variables/)了解更
 
 | 变量名          | 描述                                          |
 | --------------- | --------------------------------------------- |
-| `WEBPACK_SERVE` | 如果使用了 `serve\|s`，则为 `true`。          |
+| `WEBPACK_SERVE` | 如果使用了 `serve\|server\|s`，则为 `true`。          |
 | `WEBPACK_BUILD` | 如果使用了 `build\|bundle\|b`，则为 `true`。  |
 | `WEBPACK_WATCH` | 如果使用了 `--watch\|watch\|w`，则为 `true`。 |
 

src/content/api/compilation-object.mdx

@@ -229,11 +229,7 @@ Compilation 对象有很多可用的方法和钩子。在此页面，我们将
 - `block` - `Chunk` 的块连接。
 - `chunk` - 从依赖中删除的块。
 
-### sortItemsWithModuleIds $#sortitemswithmoduleids$
-
-`function`
-
-### sortItemsWithChunkIds $#sortitemswithchunkids$
+### sortItemsWithChunkIds $#sortitemswithmoduleids$
 
 `function`
 

src/content/api/module-variables.mdx

@@ -109,7 +109,41 @@ console.log(import.meta.webpack); // output `5` for webpack 5
 
 webpack 特定。[`module.hot`](#modulehot-webpack-specific) 的一个别名，[strict ESM](/guides/ecma-script-modules/#flagging-modules-as-esm) 中可以使用 `import.meta.webpackHot` 但是不能使用 `module.hot`。
 
-## \_\_filename (NodeJS) $#__filename-nodejs$
+## import.meta.webpackContext
+
+返回与 `require.context` 一样的值，但是仅用于 `javascript/auto` 和 `javascript/esm`。
+
+- 类型：
+
+  ```ts
+  (
+    request: string,
+    options?: {
+      recursive?: boolean;
+      regExp?: RegExp;
+      include?: RegExp;
+      exclude?: RegExp;
+      preload?: boolean | number;
+      prefetch?: boolean | number;
+      chunkName?: string;
+      exports?: string | string[][];
+      mode?: 'sync' | 'eager' | 'weak' | 'lazy' | 'lazy-once';
+    }
+  ) => webpack.Context;
+  ```
+
+- 可用版本：5.70.0+
+- 示例：
+  ```js
+  const contextRequire = import.meta.webpackContext('.', {
+    recursive: false,
+    regExp: /two/,
+    mode: 'weak',
+    exclude: /three/,
+  });
+  ```
+
+## \_\_filename (NodeJS)
 
 取决于 `node.__filename` 配置选项：