Merge branch 'cn-v7' of https://github.com/docschina/babeljs-cn into …

…cn-v7

babel.config.js

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

docs/caveats.md

@@ -43,7 +43,7 @@ If you're inheriting from a class then static properties are inherited from it
 via [\_\_proto\_\_](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Object/proto),
 this is widely supported but you may run into problems with much older browsers.
 
-**NOTE:** `__proto__` is not supported on IE <= 10 so static properties
+**NOTE:** `__proto__` is not supported on IE &leq; 10 so static properties
 **will not** be inherited. See the
 [protoToAssign](plugin-transform-proto-to-assign.md) for a possible work
 around.

docs/core.md

@@ -13,7 +13,7 @@ All transformations will use your local [configuration files](config-files.md).
 
 ## transform
 
-> babel.transform(code: string, [options?](#options): Object, callback: Function)
+> babel.transform(code: string, [options?](options.md): Object, callback: Function)
 
 Transforms the passed in `code`. Calling a callback with an object with the generated code,
 source map, and AST.
@@ -40,7 +40,7 @@ In Babel 6, this method was synchronous and `transformSync` did not exist. For b
 
 ## transformSync
 
-> babel.transformSync(code: string, [options?](#options): Object)
+> babel.transformSync(code: string, [options?](options.md): Object)
 
 Transforms the passed in `code`. Returning an object with the generated code,
 source map, and AST.
@@ -60,7 +60,7 @@ result.ast;
 
 ## transformAsync
 
-> babel.transformAsync(code: string, [options?](#options): Object)
+> babel.transformAsync(code: string, [options?](options.md): Object)
 
 Transforms the passed in `code`. Returning an promise for an object with the
 generated code, source map, and AST.
@@ -81,7 +81,7 @@ babel.transformAsync("code();", options).then(result => {
 
 ## transformFile
 
-> babel.transformFile(filename: string, [options?](#options): Object, callback: Function)
+> babel.transformFile(filename: string, [options?](options.md): Object, callback: Function)
 
 Asynchronously transforms the entire contents of a file.
 
@@ -99,7 +99,7 @@ babel.transformFile("filename.js", options, function(err, result) {
 
 ## transformFileSync
 
-> babel.transformFileSync(filename: string, [options?](#options): Object)
+> babel.transformFileSync(filename: string, [options?](options.md): Object)
 
 Synchronous version of `babel.transformFile`. Returns the transformed contents of
 the `filename`.
@@ -116,7 +116,7 @@ babel.transformFileSync("filename.js", options).code;
 
 ## transformFileAsync
 
-> babel.transformFileAsync(filename: string, [options?](#options): Object)
+> babel.transformFileAsync(filename: string, [options?](options.md): Object)
 
 Promise version of `babel.transformFile`. Returns a promise for the transformed
 contents of the `filename`.
@@ -135,7 +135,7 @@ babel.transformFileAsync("filename.js", options).then(result => {
 
 ## transformFromAst
 
-> babel.transformFromAst(ast: Object, code?: string, [options?](#options): Object, callback: Function): FileNode | null
+> babel.transformFromAst(ast: Object, code?: string, [options?](options.md): Object, callback: Function): FileNode | null
 
 Given an [AST](https://astexplorer.net/), transform it.
 
@@ -155,7 +155,7 @@ In Babel 6, this method was synchronous and `transformFromAstSync` did not exist
 
 ## transformFromAstSync
 
-> babel.transformFromAstSync(ast: Object, code?: string, [options?](#options): Object)
+> babel.transformFromAstSync(ast: Object, code?: string, [options?](options.md): Object)
 
 Given an [AST](https://astexplorer.net/), transform it.
 
@@ -173,7 +173,7 @@ const { code, map, ast } = babel.transformFromAstSync(
 
 ## transformFromAstAsync
 
-> babel.transformFromAstAsync(ast: Object, code?: string, [options?](#options): Object)
+> babel.transformFromAstAsync(ast: Object, code?: string, [options?](options.md): Object)
 
 Given an [AST](https://astexplorer.net/), transform it.
 
@@ -191,7 +191,7 @@ babel
 
 ## parse
 
-> babel.parse(code: string, [options?](#options): Object, callback: Function)
+> babel.parse(code: string, [options?](options.md): Object, callback: Function)
 
 Given some code, parse it using Babel's standard behavior. Referenced presets and
 plugins will be loaded such that optional syntax plugins are automatically
@@ -207,7 +207,7 @@ will be dropped in Babel 8.
 
 ## parseSync
 
-> babel.parseSync(code: string, [options?](#options): Object)
+> babel.parseSync(code: string, [options?](options.md): Object)
 
 Returns an AST.
 
@@ -217,7 +217,7 @@ enabled.
 
 ## parseAsync
 
-> babel.parseAsync(code: string, [options?](#options): Object)
+> babel.parseAsync(code: string, [options?](options.md): Object)
 
 Returns a promise for an AST.
 
@@ -233,7 +233,7 @@ that aid in loading the configuration part-way without transforming.
 
 ### loadOptions
 
-> babel.loadOptions([options?](#options): Object)
+> babel.loadOptions([options?](options.md): Object)
 
 Resolve Babel's options fully, resulting in an options object where:
 
@@ -250,14 +250,14 @@ invalidate properly, but it is the best we have at the moment.
 
 ### loadPartialConfig
 
-> babel.loadPartialConfig([options?](#options): Object): PartialConfig
+> babel.loadPartialConfig([options?](options.md): Object): PartialConfig
 
 To allow systems to easily manipulate and validate a user's config, this function
 resolves the plugins and presets and proceeds no further. The expectation is
 that callers will take the config's `.options`, manipulate it as they see fit
 and pass it back to Babel again.
 
-This function accepts one additional option as part of the options object in addition to the standard [options](#options): `showIgnoredFiles`.
+This function accepts one additional option as part of the options object in addition to the standard [options](options.md): `showIgnoredFiles`.
 When set to true, `loadPartialConfig` always returns a result when a file is ignored, rather than `null`.
 This is useful in order to allow the caller to access the list of files that influenced this outcome, e.g.
 for watch mode. The caller can determine whether a file was ignored based on the returned `fileHandling` property.
@@ -284,7 +284,7 @@ function for information about `ConfigItem` fields.
 
 ### createConfigItem
 
-> babel.createConfigItem(value: string | {} | Function | [string | {} | Function, {} | void], { dirname?: string, type?: "preset" | "plugin" }): ConfigItem
+> babel.createConfigItem(value: string | \{} | Function | [string | \{} | Function, \{} | void], \{ dirname?: string, type?: "preset" | "plugin" }): ConfigItem
 
 Allows build tooling to create and cache config items up front. If this function
 is called multiple times for a given plugin, Babel will call the plugin's function itself

docs/options.md

@@ -242,8 +242,8 @@ Type: `boolean`<br />
 Default: `true` as long as the `filename` option has been specified<br />
 Placement: Allowed in Babel's programmatic options, or inside of the loaded [`"configFile"`](#configfile). A programmatic option will override a config file one.<br />
 
-`true` will enable searching for [configuration files](config-files.md#file-relative-configuration) relative
-to the [`"filename"`](#filename) provided to Babel.
+`true` will enable searching for [configuration files](config-files.md#file-relative-configuration)
+and the legacy `.babelignore` file relative to the [`"filename"`](#filename) provided to Babel.
 
 A `babelrc` value passed in the programmatic options will override one set
 within a configuration file.
@@ -401,7 +401,7 @@ When no targets are specified: Babel will assume you are using the [browserslist
 
 Type: `boolean`
 
-You may also target browsers supporting ES Modules (<https://www.ecma-international.org/ecma-262/6.0/#sec-modules>). When the `esmodules` target is specified, it will intersect with the `browsers` target and `browserslist`'s targets. You can use this approach in combination with `<script type="module"></script>` to conditionally serve smaller scripts to users (https://jakearchibald.com/2017/es-modules-in-browsers/#nomodule-for-backwards-compatibility).
+You may also target browsers supporting [ES Modules](https://www.ecma-international.org/ecma-262/6.0/#sec-modules). When the `esmodules` target is specified, it will intersect with the `browsers` target and `browserslist`'s targets. You can use this approach in combination with `<script type="module"></script>` to conditionally serve smaller scripts to users (https://jakearchibald.com/2017/es-modules-in-browsers/#nomodule-for-backwards-compatibility).
 
 :::note When specifying both `browsers` and the esmodules target, they will be intersected.
 :::

docs/parser.md

@@ -202,7 +202,7 @@ require("@babel/parser").parse("code", {
 | Name | Code Example |
 |------|--------------|
 | `flow` ([repo](https://github.com/facebook/flow)) | `var a: string = "";` |
-| `flowComments` ([docs](https://flow.org/en/docs/types/comments/)) | <code>/&ast;:: type Foo = {...}; &ast;/</code> |
+| `flowComments` ([docs](https://flow.org/en/docs/types/comments/)) | <code>/&ast;:: type Foo = \{...}; &ast;/</code> |
 | `jsx` ([repo](https://facebook.github.io/jsx/)) | `<a attr="b">{s}</a>` |
 | `typescript` ([repo](https://github.com/Microsoft/TypeScript)) | `var a: string = "";` |
 | `v8intrinsic` | `%DebugPrint(foo);` |
@@ -360,7 +360,7 @@ This option is deprecated and will be removed in a future version. Code that is
     | SyntaxType | Record Example | Tuple Example |
     | --- | --- | --- |
     | `"hash"` | `#{ a: 1 }` | `#[1, 2]` |
-    | `"bar"` | <code>{&#124; a: 1 &#124;}</code> | <code>[&#124;1, 2&#124;]</code> |
+    | `"bar"` | <code>\{&#124; a: 1 &#124;}</code> | <code>[&#124;1, 2&#124;]</code> |
     See [Ergonomics of `#{}`/`#[]`](https://github.com/tc39/proposal-record-tuple/issues/10) for more information.
 
 - `flow`:

docs/plugin-proposal-decorators.md

@@ -102,7 +102,7 @@ Selects the decorators proposal to use:
 
 :::
 
-:::babel7
+::::babel7
 
 ### `version`
 
@@ -213,7 +213,7 @@ The `include` option will enable the transforms included in `@babel/preset-env`
 You can read more about configuring plugin options [here](https://babeljs.io/docs/en/plugins#plugin-options)
 :::
 
-:::
+::::
 
 ## 参考
 

docs/plugin-transform-classes.md

@@ -19,7 +19,7 @@ needs to be wrapped. This is needed to workaround two problems:
   returning it, Babel should treat it as the new `this`.
 
 The wrapper works on IE11 and every other browser with `Object.setPrototypeOf` or `__proto__` as fallback.
-There is **NO IE <= 10 support**. If you need IE <= 10 it's recommended that you don't extend natives.
+There is **NO IE &leq; 10 support**. If you need IE &leq; 10 it's recommended that you don't extend natives.
 
 Babel needs to statically know if you are extending a built-in class. For this reason, the "mixin pattern" doesn't work:
 

docs/preset-env.md

@@ -96,14 +96,14 @@ For usage, refer to the [`targets` option](options.md#targets) documentation.
 
 Added in: `v7.9.0`
 
-:::babel7
+::::babel7
 
-::::note
+:::note
 This option will be enabled by default in Babel 8.
-::::
-
 :::
 
+::::
+
 By default, `@babel/preset-env` (and Babel plugins in general) grouped ECMAScript syntax features into collections of closely related smaller features. These groups can be large and include a lot of edge cases, for example "function arguments" includes destructured, default and rest parameters. From this grouping information, Babel enables or disables each group based on the browser support target you specify to `@babel/preset-env`’s `targets` option.
 
 When this option is enabled, `@babel/preset-env` tries to compile the broken syntax to the closest _non-broken modern syntax_ supported by your target browsers. Depending on your `targets` and on how many modern syntax you are using, this can lead to a significant size reduction in the compiled app. This option merges the features of [`@babel/preset-modules`](https://github.com/babel/preset-modules) without having to use another preset.
@@ -258,9 +258,7 @@ npm install core-js
 Only use `import "core-js";` once in your whole app.
 
 :::babel7
-
 If you are using `@babel/polyfill`, it already includes `core-js`: importing it twice will throw an error.
-
 :::
 
 Multiple imports or requires of those packages might cause global collisions and other issues that are hard to trace.
@@ -307,15 +305,15 @@ import "core-js/modules/esnext.math.scale";
 
 You can read [core-js](https://github.com/zloirock/core-js)'s documentation for more information about the different entry points.
 
-:::babel7
+::::babel7
 
-::::note
+:::note
 When using `core-js@2` (either explicitly using the [`corejs: "2"`](#corejs) option or implicitly), `@babel/preset-env` will also transform imports and requires of `@babel/polyfill`.
 This behavior is deprecated because it isn't possible to use `@babel/polyfill` with different `core-js` versions.
-::::
-
 :::
 
+::::
+
 #### `useBuiltIns: 'usage'`
 
 Adds specific imports for polyfills when they are used in each file. We take advantage of the fact that a bundler will load the same polyfill only once.
@@ -362,18 +360,19 @@ Added in: `v7.4.0`
 
 :::babel7
 
-`string` or `{ version: string, proposals: boolean }`, defaults to `"2.0"`. The `version` string can be any supported `core-js` versions. For example, `"3.8"` or `"2.0"`.
+`string` or `{ version: string, proposals: boolean }`, defaults to `"2.0"`. The `version` string can be any supported `core-js` versions. For example, `"3.33"` or `"2.0"`.
+
+This option only has an effect when used alongside `useBuiltIns: usage` or `useBuiltIns: entry`, and ensures `@babel/preset-env` injects the polyfills supported by your `core-js` version. It is recommended to specify the minor version otherwise `"3"` will be interpreted as `"3.0"` which may not include polyfills for the latest features.
 
 :::
 
 :::babel8
 
-`string` or `{ version: string, proposals: boolean }`, defaults to `"3.0"`. The `version` string can be any supported `core-js` versions. For example, `"3.8"`.
+`string` or `{ version: string, proposals: boolean }`, defaults to `"3.0"`. The `version` string can be any supported `core-js` versions with a minor version. For example, `"3.33"`.
 
-:::
+This option only has an effect when used alongside `useBuiltIns: usage` or `useBuiltIns: entry`, and ensures `@babel/preset-env` injects the polyfills supported by your `core-js` version.
 
-This option only has an effect when used alongside `useBuiltIns: usage` or `useBuiltIns: entry`, and ensures `@babel/preset-env` injects the polyfills supported by your `core-js` version. It is recommended to specify the minor
-version otherwise `"3"` will be interpreted as `"3.0"` which may not include polyfills for the latest features.
+:::
 
 By default, only polyfills for stable ECMAScript features are injected: if you want to polyfill proposals, you have three different options:
 
@@ -386,7 +385,7 @@ By default, only polyfills for stable ECMAScript features are injected: if you w
 
 `boolean`, defaults to `false`.
 
-<p><details>
+<details>
   <summary><b>Example</b></summary>
 
 With Babel 7's [JavaScript config file](config-files#javascript) support, you can force all transforms to be run if env is set to `production`.
@@ -412,7 +411,7 @@ module.exports = function(api) {
 };
 ```
 
-</details></p>
+</details>
 
 :::danger
 `targets.uglify` is deprecated and will be removed in the next major in

js/repl/CodeMirror.tsx

@@ -60,7 +60,7 @@ export default class ReactCodeMirror extends React.Component<Props, State> {
     }
   }
 
-  componentWillReceiveProps(nextProps: Props) {
+  UNSAFE_componentWillReceiveProps(nextProps: Props) {
     if (
       nextProps.value &&
       nextProps.value !== this.props.value &&
@@ -130,7 +130,7 @@ injectGlobal({
   ".CodeMirror": {
     height: "100% !important",
     width: "100% !important",
-    "-webkit-overflow-scrolling": "touch",
+    WebkitOverflowScrolling: "touch",
   },
   ".CodeMirror pre.CodeMirror-placeholder.CodeMirror-line-like": css({
     color: colors.foregroundLight,

js/repl/CodeMirrorPanel.tsx

@@ -53,7 +53,7 @@ const sharedBoxStyles: Interpolation = {
   padding: "0.5rem 0.75rem",
   fontFamily: "monospace",
   whiteSpace: "pre-wrap",
-  "-webkit-overflow-scrolling": "touch",
+  WebkitOverflowScrolling: "touch",
 };
 
 const styles = {

js/repl/Modal.tsx

@@ -1,6 +1,6 @@
 import { css, keyframes } from "@emotion/css";
 import React, { Component } from "react";
-import ReactDOM from "react-dom";
+import { createPortal } from "react-dom";
 
 import type { ReactNode, SyntheticEvent } from "react";
 
@@ -84,7 +84,7 @@ export default class Modal extends Component<Props> {
       </React.Fragment>
     );
 
-    return ReactDOM.createPortal(result, this._node);
+    return createPortal(result, this._node);
   }
 }