From 8672f34d217c6e4e5ca1d20a7f458b5d89a50707 Mon Sep 17 00:00:00 2001 From: Kevan Stannard Date: Fri, 15 Jan 2021 22:59:54 +1100 Subject: [PATCH 1/7] Installation in an existing project --- pages/docs/manual/latest/installation.mdx | 56 +++++++++++++++++++++-- 1 file changed, 53 insertions(+), 3 deletions(-) diff --git a/pages/docs/manual/latest/installation.mdx b/pages/docs/manual/latest/installation.mdx index 2a360486f..9650d8d69 100644 --- a/pages/docs/manual/latest/installation.mdx +++ b/pages/docs/manual/latest/installation.mdx @@ -34,12 +34,62 @@ Alternatively, **to start a [ReasonReact](https://reasonml.github.io/reason-reac ## Integrate Into Existing JS Project -You can install the toolchain locally to an existing JS project, through the familiar command: +You can install ReScript locally into an existing JS project using the following steps. + +### Install ReScript ```sh npm install --save-dev bs-platform ``` -The rest is the same as above. Since we output clean `.bs.js` files, the rest of your existing toolchain (e.g. Babel and Webpack) should mostly just work. Nothing to learn on the bundling side! +### Create config file + +Create a `bsconfig.json` file in the root of your project with the following content. + +```json +{ + "name": "your-project-name", + "reason": { "react-jsx": 3 }, + "bsc-flags": ["-bs-super-errors"], + "sources": [ + { + "dir": "src", + "subdirs": true + } + ], + "package-specs": [ + { + "module": "es6", + "in-source": true + } + ], + "suffix": ".bs.js", + "namespace": true, + "bs-dependencies": [], + "ppx-flags": [], + "refmt": 3 +} +``` + +> Update `sources` to indicate where your ReScript source files will be located. + +See [Build Configuration](build-configuration) for more details on `bsconfig.json`. + +### Add scripts to package.json + +You may also like to add two scripts to your `package.json` to help with compiling ReScript. + +```json +"scripts": { + "re:build": "bsb -make-world -clean-world", + "re:watch": "bsb -make-world -clean-world -w" +} +``` + +### Using the compiled code + +Since we compile to clean readable JavaScript files the rest of your existing toolchain (e.g. Babel and Webpack) should just work. + +See the [Export to JS guide](import-from-export-to-js#export-to-javascript) to learn how to import ReScript compiled modules into your exising project. -See also our highly recommended guide to [convert from JavaScript](converting-from-js). +See the [Convert from JS guide](converting-from-js) to learn how to convert existing JS code to ReScript. From 89cf9995a6a95a3dd8cd66ff9a3fd3b97c3b5803 Mon Sep 17 00:00:00 2001 From: Kevan Stannard Date: Fri, 15 Jan 2021 23:30:49 +1100 Subject: [PATCH 2/7] JavaScript => JS --- pages/docs/manual/latest/installation.mdx | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/pages/docs/manual/latest/installation.mdx b/pages/docs/manual/latest/installation.mdx index 9650d8d69..92428ffb2 100644 --- a/pages/docs/manual/latest/installation.mdx +++ b/pages/docs/manual/latest/installation.mdx @@ -88,7 +88,7 @@ You may also like to add two scripts to your `package.json` to help with compili ### Using the compiled code -Since we compile to clean readable JavaScript files the rest of your existing toolchain (e.g. Babel and Webpack) should just work. +Since we compile to clean readable JS files the rest of your existing toolchain (e.g. Babel and Webpack) should just work. See the [Export to JS guide](import-from-export-to-js#export-to-javascript) to learn how to import ReScript compiled modules into your exising project. From ebee988da3a94e3341d7d19c9ea99c51f13779a8 Mon Sep 17 00:00:00 2001 From: Kevan Stannard Date: Fri, 15 Jan 2021 23:32:23 +1100 Subject: [PATCH 3/7] Tweak text --- pages/docs/manual/latest/installation.mdx | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/pages/docs/manual/latest/installation.mdx b/pages/docs/manual/latest/installation.mdx index 92428ffb2..6c3e28aeb 100644 --- a/pages/docs/manual/latest/installation.mdx +++ b/pages/docs/manual/latest/installation.mdx @@ -92,4 +92,4 @@ Since we compile to clean readable JS files the rest of your existing toolchain See the [Export to JS guide](import-from-export-to-js#export-to-javascript) to learn how to import ReScript compiled modules into your exising project. -See the [Convert from JS guide](converting-from-js) to learn how to convert existing JS code to ReScript. +See the [Converting from JS guide](converting-from-js) to learn how to convert existing JS code to ReScript. From 1480b9e2880fe9057e83f2c1467c36e2ad1610ff Mon Sep 17 00:00:00 2001 From: Kevan Stannard Date: Sat, 16 Jan 2021 10:53:08 +1100 Subject: [PATCH 4/7] Update pages/docs/manual/latest/installation.mdx Co-authored-by: Patrick Ecker --- pages/docs/manual/latest/installation.mdx | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/pages/docs/manual/latest/installation.mdx b/pages/docs/manual/latest/installation.mdx index 6c3e28aeb..cbd5e0db5 100644 --- a/pages/docs/manual/latest/installation.mdx +++ b/pages/docs/manual/latest/installation.mdx @@ -34,7 +34,7 @@ Alternatively, **to start a [ReasonReact](https://reasonml.github.io/reason-reac ## Integrate Into Existing JS Project -You can install ReScript locally into an existing JS project using the following steps. +You can install ReScript locally into an existing JavaScript project using the following steps. ### Install ReScript From 6103213cf1fccfc040a625844f3d6b999c50db34 Mon Sep 17 00:00:00 2001 From: Kevan Stannard Date: Sat, 16 Jan 2021 10:54:19 +1100 Subject: [PATCH 5/7] Fix typo --- pages/docs/manual/latest/installation.mdx | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/pages/docs/manual/latest/installation.mdx b/pages/docs/manual/latest/installation.mdx index 6c3e28aeb..b2c11d4b5 100644 --- a/pages/docs/manual/latest/installation.mdx +++ b/pages/docs/manual/latest/installation.mdx @@ -90,6 +90,6 @@ You may also like to add two scripts to your `package.json` to help with compili Since we compile to clean readable JS files the rest of your existing toolchain (e.g. Babel and Webpack) should just work. -See the [Export to JS guide](import-from-export-to-js#export-to-javascript) to learn how to import ReScript compiled modules into your exising project. +See the [Export to JS guide](import-from-export-to-js#export-to-javascript) to learn how to import ReScript compiled modules into your existing project. See the [Converting from JS guide](converting-from-js) to learn how to convert existing JS code to ReScript. From d751ea908de7af082dd533ce663e41b445ee532c Mon Sep 17 00:00:00 2001 From: Kevan Stannard Date: Sat, 16 Jan 2021 13:05:52 +1100 Subject: [PATCH 6/7] Remove "reason" prop in vanilla bsconfig --- pages/docs/manual/latest/installation.mdx | 1 - 1 file changed, 1 deletion(-) diff --git a/pages/docs/manual/latest/installation.mdx b/pages/docs/manual/latest/installation.mdx index eee3ed99f..ec019db73 100644 --- a/pages/docs/manual/latest/installation.mdx +++ b/pages/docs/manual/latest/installation.mdx @@ -49,7 +49,6 @@ Create a `bsconfig.json` file in the root of your project with the following con ```json { "name": "your-project-name", - "reason": { "react-jsx": 3 }, "bsc-flags": ["-bs-super-errors"], "sources": [ { From 43e664f300407de53d23c3fc171c5a2c06f4a2dd Mon Sep 17 00:00:00 2001 From: Kevan Stannard Date: Sat, 16 Jan 2021 13:16:29 +1100 Subject: [PATCH 7/7] Add Enabling React JS section --- pages/docs/manual/latest/installation.mdx | 19 ++++++++++++++++++- 1 file changed, 18 insertions(+), 1 deletion(-) diff --git a/pages/docs/manual/latest/installation.mdx b/pages/docs/manual/latest/installation.mdx index ec019db73..dbb018f60 100644 --- a/pages/docs/manual/latest/installation.mdx +++ b/pages/docs/manual/latest/installation.mdx @@ -85,9 +85,26 @@ You may also like to add two scripts to your `package.json` to help with compili } ``` +### Enabling React JS + +If you would like to enable React in your ReScript code, use the following additional steps: + +Install [Reason React](https://reasonml.github.io/reason-react/en/). + +```sh +npm install reason-react +``` + +Make the following changes to your `bsconfig.json` file: + +```json +"reason": { "react-jsx": 3 }, +"bs-dependencies": ["reason-react"], +``` + ### Using the compiled code -Since we compile to clean readable JS files the rest of your existing toolchain (e.g. Babel and Webpack) should just work. +Since ReScript compiles to clean readable JS files the rest of your existing toolchain (e.g. Babel and Webpack) should just work. See the [Export to JS guide](import-from-export-to-js#export-to-javascript) to learn how to import ReScript compiled modules into your existing project.