Merge pull request #1616 from docschina/sync-48a23c51

docs(en): merge webpack.js.org/master into webpack.js.org/cn @ 48a23c5

Author: jacob-lcs

package.json

@@ -21,7 +21,7 @@
     "url": "https://github.com/webpack/webpack.js.org/issues"
   },
   "engines": {
-    "node": ">=12"
+    "node": ">=14"
   },
   "scripts": {
     "clean-dist": "rimraf ./dist",
@@ -73,31 +73,31 @@
     ]
   },
   "devDependencies": {
-    "@babel/core": "^7.18.5",
+    "@babel/core": "^7.18.6",
     "@babel/eslint-parser": "^7.18.2",
     "@babel/plugin-proposal-class-properties": "^7.17.12",
-    "@babel/preset-env": "^7.18.2",
-    "@babel/preset-react": "^7.17.12",
+    "@babel/preset-env": "^7.18.6",
+    "@babel/preset-react": "^7.18.6",
     "@mdx-js/loader": "^2.0.0-next.9",
-    "@octokit/auth-action": "^1.3.3",
-    "@octokit/rest": "^18.12.0",
-    "@parcel/css": "^1.10.1",
+    "@octokit/auth-action": "^2.0.0",
+    "@octokit/rest": "^19.0.3",
+    "@parcel/css": "^1.11.2",
     "@pmmmwh/react-refresh-webpack-plugin": "next",
     "@svgr/webpack": "^6.2.1",
     "autoprefixer": "^10.4.7",
     "babel-loader": "^8.2.5",
     "copy-webpack-plugin": "^11.0.0",
     "css-loader": "^6.7.1",
     "css-minimizer-webpack-plugin": "^4.0.0",
-    "cypress": "^10.2.0",
+    "cypress": "^10.3.0",
     "directory-tree": "^3.3.0",
     "directory-tree-webpack-plugin": "^1.0.3",
     "duplexer": "^0.1.1",
-    "eslint": "^8.18.0",
+    "eslint": "^8.19.0",
     "eslint-config-prettier": "^8.5.0",
     "eslint-plugin-cypress": "^2.12.1",
-    "eslint-plugin-mdx": "^2.0.0",
-    "eslint-plugin-react": "^7.30.0",
+    "eslint-plugin-mdx": "^2.0.1",
+    "eslint-plugin-react": "^7.30.1",
     "eslint-plugin-react-hooks": "^4.6.0",
     "front-matter": "^4.0.2",
     "github-slugger": "^1.4.0",
@@ -106,19 +106,19 @@
     "http-server": "^14.1.1",
     "husky": "^8.0.1",
     "hyperlink": "^5.0.4",
-    "jest": "^28.1.1",
-    "lint-staged": "^13.0.2",
+    "jest": "^28.1.2",
+    "lint-staged": "^13.0.3",
     "lodash": "^4.17.21",
     "markdownlint": "^0.26.0",
     "markdownlint-cli": "^0.31.1",
     "mdast-util-to-string": "^3.1.0",
     "mini-css-extract-plugin": "^2.6.1",
     "mkdirp": "^1.0.4",
     "modularscale-sass": "^3.0.3",
-    "node-fetch": "^3.2.6",
+    "node-fetch": "^3.2.8",
     "npm-run-all": "^4.1.1",
     "postcss": "^8.4.14",
-    "postcss-loader": "^7.0.0",
+    "postcss-loader": "^7.0.1",
     "prettier": "^2.7.1",
     "react-refresh": "^0.14.0",
     "redirect-webpack-plugin": "^1.0.0",
@@ -132,20 +132,20 @@
     "remark-refractor": "montogeek/remark-refractor",
     "rimraf": "^3.0.2",
     "sass": "^1.53.0",
-    "sass-loader": "^13.0.0",
+    "sass-loader": "^13.0.2",
     "sirv-cli": "^2.0.2",
     "sitemap-static": "^0.4.2",
     "static-site-generator-webpack-plugin": "^3.4.1",
     "style-loader": "^3.3.1",
-    "tailwindcss": "^3.1.4",
+    "tailwindcss": "^3.1.6",
     "tap-spot": "^1.1.2",
     "textlint": "^11.8.2",
     "textlint-rule-heading": "^1.0.10",
     "unist-util-visit": "^4.1.0",
     "webpack": "^5.73.0",
     "webpack-bundle-analyzer": "^4.5.0",
     "webpack-cli": "^4.10.0",
-    "webpack-dev-server": "^4.9.2",
+    "webpack-dev-server": "^4.9.3",
     "webpack-merge": "^5.8.0",
     "workbox-webpack-plugin": "^6.5.3"
   },

src/components/Navigation/Navigation.jsx

@@ -212,12 +212,13 @@ function Navigation({ links, pathname, hash = '', toggleSidebar }) {
                   {link.children.map((child) => {
                     const classNames =
                       'text-blue-400 py-5 text-sm capitalize hover:text-black dark:hover:text-white';
+                    const isActive = location.pathname.startsWith(child.url);
                     return (
                       <NavLink
                         key={child.url}
                         to={child.url}
                         title={child.title}
-                        className={({ isActive }) =>
+                        className={() =>
                           isActive
                             ? `!text-black dark:!text-white ${classNames}`
                             : classNames

src/content/api/module-methods.mdx

@@ -436,3 +436,15 @@ __webpack_modules__[require.resolveWeak(`./page/${page}`)];
 ```
 
 T> `require.resolveWeak` 是_通用渲染_（服务器端渲染 SSR + 代码分割 Code Splitting）的基础。例如在 [react-universal-component](https://github.com/faceyspacey/react-universal-component) 等包中的用法。它允许代码在服务器端和客户端初始页面的加载上同步渲染。它要求手动或以某种方式提供 chunk。它可以在不需要指示应该被打包的情况下引入模块。它与 `import()` 一起使用，当用户导航触发额外的导入时，它会被接管。
+
+### warning
+
+如果模块源码包含无法静态分析的 require，则会发出关键依赖项警告。
+
+示例代码：
+
+```javascript
+someFn(require);
+require.bind(null);
+require(variable);
+```

src/content/api/module-variables.mdx

@@ -268,6 +268,8 @@ __webpack_get_script_filename__ = (chunkId) => {
 
 - 可以从嵌套的 exports 中得到相关信息: 例如 `__webpack_exports_info__.<exportName>.<exportName>.<exportName>.used`
 
+- Check whether exports can be mangled with `__webpack_exports_info__.<name>.canMangle`
+
 ## \_\_webpack_is_included\_\_ (webpack-specific)
 
 <Badge text="5.16.0+" />

src/content/awesome-webpack.mdx

@@ -171,6 +171,7 @@ _People passionate about Webpack (In no particular order)_
 - [Chrome Extension Archive Webpack Plugin](https://github.com/KeisukeYamashita/chrome-extension-archive-webpack-plugin) Create archive file to publish Chrome Exentions to Chrome Web Store -- _Maintainer_: `KeisukeYamashita` [![Github][githubicon]](https://github.com/KeisukeYamashita)
 - [Layer-pack Webpack Plugin](https://github.com/layer-pack/layer-pack) Allow to glob imports file & directories, build mono repo apps via inheritable source code / npm packages & share webpack configs -- _Maintainer_: `Braun Nathanaël` [![Github][githubicon]](https://github.com/N8tz)
 - [webpack-typescript-directory-compile-plugin](https://github.com/ssigwart/webpack-typescript-directory-compile-plugin) Configure an source directory of typescript files and an output directory for JavaScript files.  Each typescript file in the source directory and any newly added files will be compiled to individual JavaScript files. -- _Maintainer_: `Stephen Sigwart` [![Github][githubicon]](https://github.com/ssigwart)
+- [CycloneDX Webpack Plugin](https://github.com/CycloneDX/cyclonedx-webpack-plugin#readme): Create CycloneDX Software Bill of Materials (SBOM) from webpack bundles at compile time. -- _Maintainer_: `OWASP CycloneDX Team` [![Github][githubicon]](https://github.com/CycloneDX)
 
 ### Webpack Tools
 

src/content/concepts/module-federation.mdx

@@ -259,7 +259,7 @@ export function set(value) {
 const publicPath = await import('remote/public-path');
 publicPath.set('/your-public-path');
 
-//boostrap app  e.g. import('./boostrap.js')
+//bootstrap app  e.g. import('./bootstrap.js')
 ```
 
 ### Infer publicPath from script $#inferpublicpathfromscript$

src/content/configuration/other-options.mdx

@@ -437,16 +437,22 @@ module.exports = {
 
 ### immutablePaths $#immutable-paths$
 
-`[string]`
+`(RegExp | string)[]`
 
 由包管理器管理的路径数组，在其路径中包含一个版本或哈希，以便所有文件都是不可变的（immutable）。
 
+如果使用正则表达式，请确保将路径包裹在捕获组中。
+
 ### managedPaths $#managedpaths$
+如果使用正则表达式，请确保将路径包裹在捕获组中。
 
-`[string]`
+### managedPaths
+
+`(RegExp | string)[]`
 
 由包管理器管理的路径数组，可以信任它不会被修改。
 
+如果使用正则表达式，请确保将路径包裹在捕获组中。
 
 ### module $#module$