docs(en): merge website/main into babeljs.cn/cn-v7 @ f38640f (#183)

.yarnrc.yml

@@ -1,5 +1,7 @@
+compressionLevel: mixed
+
 enableGlobalCache: true
 
 nodeLinker: node-modules
 
-yarnPath: .yarn/releases/yarn-3.6.1.cjs
+yarnPath: .yarn/releases/yarn-4.0.1.cjs

babel.config.js

@@ -16,7 +16,7 @@ module.exports = function (api) {
           shippedProposals: true,
         },
       ],
-      "@babel/preset-react",
+      [ "@babel/preset-react", { development: process.env.NODE_ENV === "development" } ],
       [
         "@babel/preset-typescript",
         {

js/repl/index.html

@@ -584,8 +584,8 @@
         <div id="root">
           <noscript>You need to enable JavaScript to run this app.</noscript>
         </div>
-        <script src="https://unpkg.com/react@16.3.2/umd/react.production.min.js"></script>
-        <script src="https://unpkg.com/react-dom@16.3.2/umd/react-dom.production.min.js"></script>
+        <script src="https://unpkg.com/react@17.0.2/umd/react.production.min.js"></script>
+        <script src="https://unpkg.com/react-dom@17.0.2/umd/react-dom.production.min.js"></script>
         <script src="https://unpkg.com/[email protected]/lib/codemirror.js"></script>
         <script src="https://unpkg.com/[email protected]/mode/javascript/javascript.js"></script>
         <script src="https://unpkg.com/[email protected]/mode/xml/xml.js"></script>
@@ -596,8 +596,8 @@
         <script src="https://unpkg.com/[email protected]/addon/edit/matchbrackets.js"></script>
         <script src="https://unpkg.com/[email protected]/addon/search/searchcursor.js"></script>
         <script src="https://unpkg.com/[email protected]/addon/selection/active-line.js"></script>
-        <script src="https://unpkg.com/lz-string@1.4.4/libs/base64-string.js"></script>
-        <script src="https://unpkg.com/lz-string@1.4.4/libs/lz-string.min.js"></script>
+        <script src="https://unpkg.com/lz-string@1.5.0/libs/base64-string.js"></script>
+        <script src="https://unpkg.com/lz-string@1.5.0/libs/lz-string.min.js"></script>
       </div>
     </div>
   </body>

package.json

@@ -49,7 +49,7 @@
     "@emotion/babel-plugin": "^11.11.0",
     "@rollup/plugin-node-resolve": "^15.1.0",
     "@rollup/plugin-terser": "^0.4.3",
-    "@types/react": "16",
+    "@types/react": "^17.0.2",
     "@typescript-eslint/eslint-plugin": "^6.3.0",
     "@typescript-eslint/parser": "^6.3.0",
     "babel-loader": "^9.1.3",
@@ -82,19 +82,19 @@
     "worker-loader": "^3.0.8"
   },
   "dependencies": {
-    "@babel/generator": "^7.21.4",
+    "@babel/generator": "8.0.0-alpha.2",
     "@emotion/css": "^11.10.6",
     "algoliasearch": "^4.12.0",
     "buffer": "^5.7.1",
     "codemirror": "^5.65.0",
     "core-js": "^3.0.1",
     "lodash.camelcase": "^4.3.0",
     "lodash.debounce": "^4.0.8",
-    "lz-string": "^1.4.4",
-    "react": "^16.0.0",
-    "react-dom": "^16.0.0",
-    "react-instantsearch-dom": "^6.7.0",
-    "regenerator-runtime": "^0.13.9",
+    "lz-string": "^1.5.0",
+    "react": "^17.0.2",
+    "react-dom": "^17.0.2",
+    "react-instantsearch-dom": "^6.40.4",
+    "regenerator-runtime": "^0.14.0",
     "unfetch": "^4.2.0"
   },
   "workspaces": [
@@ -114,5 +114,5 @@
       "git add"
     ]
   },
-  "packageManager": "yarn@3.6.1"
+  "packageManager": "yarn@4.0.1"
 }

website/blog/2021-02-22-7.13.0.md

@@ -39,11 +39,13 @@ We welcome donations from both individual and companies. If your company is inte
 `@babel/preset-env`'s `targets` option allows users to specify their target environments, automatically choosing which syntax to transform and what polyfills to inject. Since releasing `@babel/preset-env`, we've learned that plugins _themselves_ can also benefit from knowing your targets. Currently, this can a bit cumbersome, as you have to specify your targets twice (for example, if you are using our [new polyfill plugins](https://github.com/babel/babel-polyfills)). By introducing `targets` as a top level option, you now only have to specify your targets once:
 
 <table>
-<tbody style={{width: "100%", display: "table", tableLayout: "fixed"}}>
+<thead>
 <tr>
 <th>Old configuration</th>
 <th>New configuration</th>
 </tr>
+</thead>
+<tbody>
 <tr>
 <td>
 
@@ -101,12 +103,14 @@ This is **advanced** functionality. Like the previous `loose` option, please be
 
 For example, when transforming classes, Babel will generate this output by default:
 
-<table>
-<tbody style={{width: "100%", display: "table", tableLayout: "fixed"}}>
+<table style={{width: "100%", display: "table", tableLayout: "fixed"}}>
+<thead>
 <tr>
 <th>Input</th>
 <th>Output</th>
 </tr>
+</thead>
+<tbody>
 <tr>
 <td>
 
@@ -158,12 +162,14 @@ However, enabling the `noClassCalls` assumption tells Babel "I'm never trying to
 }
 ```
 
-<table>
-<tbody style={{width: "100%", display: "table", tableLayout: "fixed"}}>
+<table style={{width: "100%", display: "table", tableLayout: "fixed"}}>
+<thead>
 <tr>
 <th>Input</th>
 <th>Output</th>
 </tr>
+</thead>
+<tbody>
 <tr>
 <td>
 
@@ -203,12 +209,14 @@ Thanks to a collaboration with [Bloomberg](https://www.techatbloomberg.com/), Ba
 
 The Babel plugin transforms records and tuples syntax using the global `Record` and `Tuple` functions:
 
-<table>
-<tbody style={{width: "100%", display: "table", tableLayout: "fixed"}}>
+<table style={{width: "100%", display: "table", tableLayout: "fixed"}}>
+<thead>
 <tr>
 <th>Input</th>
 <th>Output</th>
 </tr>
+</thead>
+<tbody>
 <tr>
 <td>
 

website/blog/2022-05-19-7.18.0.md

@@ -25,10 +25,13 @@ If you or your company want to support Babel and the evolution of JavaScript, bu
 Babel supports transforming the [private destructuring](https://github.com/tc39/proposal-destructuring-private) proposal. Now you can use private fields or methods in destructuring patterns:
 
 <table>
+<thead>
 <tr>
 <th>Input</th>
 <th>Output</th>
 </tr>
+</thead>
+<tbody>
 <tr>
 <td>
 
@@ -69,6 +72,7 @@ class Foo {
 
 </td>
 </tr>
+</tbody>
 </table>
 
 You can enable it by adding the `@babel/plugin-proposal-destructuring-private` plugin to your configuration.

website/blog/2023-09-25-7.23.0.md

@@ -124,7 +124,7 @@ This proposal is championed by [Nicolò Ribaudo](https://nicr.dev/), a member of
 
 You can try this proposal using the `@babel/plugin-proposal-optional-chaining-assign` plugin. Given the early stage and thus the high possibility of breaking changes, you must specify which version you want to use (currently only `2023-07` is supported):
 
-```jsonc 
+```jsonc
 // babel.config.json
 {
   "plugins": [
@@ -156,7 +156,10 @@ As an example, given this project structure (where `src` contains the source fil
 
 and with the following configuration files:
 <table>
+<thead>
 <tr><th>babel.config.json</th><th>tsconfig.json</th></tr>
+</thead>
+<tbody>
 <tr><td>
 
 ```json
@@ -185,6 +188,7 @@ and with the following configuration files:
 ```
 
 </td></tr>
+</tbody>
 </table>
 
 you will be able to write `import x from "./dep.ts"` in `main.ts`, and Babel will transform it to `import x from "./dep.js"` when compiling `main.ts` to `main.js`.

website/docusaurus.config.js

@@ -10,14 +10,14 @@ function bool(value) {
 
 function findMarkDownSync(startPath) {
   const result = [];
-  const files = fs.readdirSync(path.join(__dirname, startPath));
-  files.forEach(val => {
-    const fPath = path.join(startPath, val);
-    const stats = fs.statSync(fPath);
-    if (stats.isDirectory()) {
+  const files = fs.readdirSync(path.join(__dirname, startPath), {
+    withFileTypes: true,
+  });
+  files.forEach((dirent) => {
+    if (dirent.isDirectory()) {
       result.push({
-        title: val,
-        path: fPath,
+        title: dirent.name,
+        path: path.join(startPath, dirent.name),
       });
     }
   });

website/package.json

@@ -13,10 +13,10 @@
     "@docusaurus/core": "^2.4.1",
     "@docusaurus/preset-classic": "^2.4.1",
     "@docusaurus/remark-plugin-npm2yarn": "^2.4.1",
-    "react": "^16.0.0",
-    "react-dom": "^16.0.0",
+    "react": "^17.0.2",
+    "react-dom": "^17.0.2",
     "react-markdown": "^8.0.5",
-    "rehype-raw": "^6.1.1"
+    "rehype-raw": "^7.0.0"
   },
   "version": "0.0.0"
 }