Skip to content
This repository was archived by the owner on Jun 15, 2023. It is now read-only.

Fix JSX v4 spec about configuration #719

Merged
merged 3 commits into from
Nov 6, 2022
Merged
Changes from all commits
Commits
File filter

Filter by extension

Filter by extension

Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
22 changes: 16 additions & 6 deletions cli/JSXV4.md
Original file line number Diff line number Diff line change
Expand Up @@ -18,16 +18,26 @@ To build an entire project in V4 mode, including all its dependencies, use the n
### Dependency-level config

Dependencies inherit the `jsx` configuration of the root project. So if the root project uses V4 then the dependencies are built using V4, and the same for V3.
To build certain dependencies in V3 compatibility mode, whatever the version used in the root project, use `"v3-dependencies"` as in the example:
To build certain dependencies in V3 compatibility mode, whatever the version used in the root project, use `"v3-dependencies"`: the listed dependencies will be built in V3 mode, and in addition `-open ReatcV3` is added to the compiler options.

For example, suppose a V3 project uses rescript-react 0.11, which requires compatibility mode if compiled with V3, and that 2 dependencies `"rescript-react-native", "rescript-react-navigation"` only build with compatibility mode. Then the setting will be:

```json
"jsx": {
"version": 4,
"v3-dependencies": ["rescript-react-native", "rescript-react-navigation"]
}
"version": 3,
"v3-dependencies": ["rescript-react-native", "rescript-react-navigation"]
},
"bsc-flags": ["-open ReactV3"]
```

In V3 compatibility mode, the listed dependencies are built in V3 mode, and in addition `-open ReatcV3` is added to the compiler options, so that the `ReactV3` compatibility module in rescript-react is used.
Another example is a V4 project that also uses `"rescript-react-native", "rescript-react-navigation"`. Then the setting will be:

```json
"jsx": {
"version": 4,
"v3-dependencies": ["rescript-react-native", "rescript-react-navigation"]
}
```

> Note: do not add @rescript/react to the v3-dependencies, or it will cause a cyclic dependencies error.
Expand Down Expand Up @@ -378,7 +388,6 @@ let p: A.props<_> = {x: "x", y: "y"}

V4 introduces support to control the definition of the `props` type by passing as argument to `@react.component` the body of the type definition of `props`. The main application is sharing a single type definition across several components. Here are a few examples:


```rescript
type sharedprops<'x, 'y> = {x: 'x, y: 'y, z:string}
Expand All @@ -400,6 +409,7 @@ module C3 = {
```

The generated code (some details removed) looks like this:

```rescript
@@jsxConfig({version: 4, mode: "classic"})
Expand Down