;
-};
-
-let default = make;
-
-let getInitialProps = context =>
- Js.Promise.make((~resolve, ~reject as _) => {
- let onServer =
- switch (Js.Nullable.toOption(context##req)) {
- | None => false
- | Some(_) => true
- };
- resolve(. {"onServer": onServer});
- });
-
-let inject:
- (
- Js.t('a) => React.element,
- {. "req": Js.Nullable.t(Js.t('a))} => Js.Promise.t(Js.t('a))
- ) =>
- unit = [%bs.raw
- {| (cls, fn) => cls.getInitialProps = fn |}
-];
-
-inject(default, getInitialProps);
diff --git a/examples/with-reasonml/.babelrc b/examples/with-rescript/.babelrc
similarity index 100%
rename from examples/with-reasonml/.babelrc
rename to examples/with-rescript/.babelrc
diff --git a/examples/with-reasonml/.gitignore b/examples/with-rescript/.gitignore
similarity index 97%
rename from examples/with-reasonml/.gitignore
rename to examples/with-rescript/.gitignore
index 96cf7120a00c2..616c612cc43e3 100644
--- a/examples/with-reasonml/.gitignore
+++ b/examples/with-rescript/.gitignore
@@ -21,7 +21,7 @@
bs
.merlin
lib/
-*.bs.js
+src/*.bs.js
.bsb.lock
# debug
diff --git a/examples/with-reasonml/README.md b/examples/with-rescript/README.md
similarity index 55%
rename from examples/with-reasonml/README.md
rename to examples/with-rescript/README.md
index bab95e3447e6e..1ba590bd0f809 100644
--- a/examples/with-reasonml/README.md
+++ b/examples/with-rescript/README.md
@@ -1,44 +1,36 @@
-# Example app using ReasonML & ReasonReact components
+# Example app using ReScript & React components
This example features:
-- An app that mixes together JavaScript and ReasonML components and functions
+- An app that mixes together JavaScript ReScript components and functions
- An app with two pages which has a common Counter component
-- That Counter component maintain the counter inside its module. This is used
- primarily to illustrate that modules get initialized once and their state
- variables persist in runtime
+- That Counter component maintain the counter inside its module. This is used primarily to illustrate that modules get initialized once and their state variables persist in runtime
## Deploy your own
Deploy the example using [Vercel](https://vercel.com?utm_source=github&utm_medium=readme&utm_campaign=next-example):
-[](https://vercel.com/new/git/external?repository-url=https://github.com/vercel/next.js/tree/canary/examples/with-reasonml&project-name=with-reasonml&repository-name=with-reasonml)
+[](https://vercel.com/new/git/external?repository-url=https://github.com/vercel/next.js/tree/canary/examples/with-rescript&project-name=with-rescript&repository-name=with-rescript)
## How to use
Execute [`create-next-app`](https://github.com/vercel/next.js/tree/canary/packages/create-next-app) with [npm](https://docs.npmjs.com/cli/init) or [Yarn](https://yarnpkg.com/lang/en/docs/cli/create/) to bootstrap the example:
```bash
-npx create-next-app --example with-reasonml with-reasonml-app
+npx create-next-app --example with-rescript with-rescript-app
# or
-yarn create next-app --example with-reasonml with-reasonml-app
+yarn create next-app --example with-rescript with-rescript-app
```
Deploy it to the cloud with [Vercel](https://vercel.com/new?utm_source=github&utm_medium=readme&utm_campaign=next-example) ([Documentation](https://nextjs.org/docs/deployment)).
### Recommendation:
-Run BuckleScript build system `bsb -w` and `next -w` separately. For the sake
-of simple convention, `npm run dev` run both `bsb` and `next` concurrently.
-However, this doesn't offer the full [colorful and very, very, veeeery nice
-error
-output](https://reasonml.github.io/blog/2017/08/25/way-nicer-error-messages.html)
-experience that ReasonML can offer, don't miss it!
+Run ReScript's build system `rescript build -w` and `next` separately.
There are 2 convenience scripts to facilitate running these separate processes:
-1. `npm run dev:reason` - This script will start the ReasonML toolchain in
- watch mode to re-compile whenever you make changes.
+1. `npm run watch` - This script will start the ReScript compiler in watch mode to re-compile whenever you make changes.
2. `npm run dev:next` - This script will start the next.js development server
so that you will be able to access your site at the location output by the
script. This will also hot reload as you make changes.
diff --git a/examples/with-rescript/bsconfig.json b/examples/with-rescript/bsconfig.json
new file mode 100644
index 0000000000000..7b159a804d51d
--- /dev/null
+++ b/examples/with-rescript/bsconfig.json
@@ -0,0 +1,20 @@
+{
+ "name": "with-rescript",
+ "reason": { "react-jsx": 3 },
+ "sources": [
+ {
+ "dir": "src",
+ "subdirs": true
+ }
+ ],
+ "bs-dependencies": ["@rescript/react"],
+ "package-specs": {
+ "module": "es6",
+ "in-source": true
+ },
+ "suffix": ".bs.js",
+ "warnings": {
+ "number": "-3",
+ "error": "+101+8"
+ }
+}
diff --git a/examples/with-reasonml/index.js b/examples/with-rescript/index.js
similarity index 100%
rename from examples/with-reasonml/index.js
rename to examples/with-rescript/index.js
diff --git a/examples/with-rescript/jsconfig.json b/examples/with-rescript/jsconfig.json
new file mode 100644
index 0000000000000..36aa1a4dc28f1
--- /dev/null
+++ b/examples/with-rescript/jsconfig.json
@@ -0,0 +1,5 @@
+{
+ "compilerOptions": {
+ "baseUrl": "."
+ }
+}
diff --git a/examples/with-rescript/next.config.js b/examples/with-rescript/next.config.js
new file mode 100644
index 0000000000000..c0ded63323a65
--- /dev/null
+++ b/examples/with-rescript/next.config.js
@@ -0,0 +1,29 @@
+const bsconfig = require('./bsconfig.json');
+const fs = require("fs");
+
+const transpileModules = ["rescript"].concat(bsconfig["bs-dependencies"]);
+const withTM = require("next-transpile-modules")(transpileModules);
+
+// There is an issue where webpack doesn't detect npm packages within node_modules when
+// there is no dedicated package.json "main" entry + index.js file existent.
+// This function will make sure that every ReScript dependency folder is conforming
+// to webpack's resolve mechanism
+//
+// This will eventually be removed at some point, so keep an eye out for updates
+// on our template repository.
+function patchResDeps() {
+ ["rescript"].concat(bsconfig["bs-dependencies"]).forEach((bsDep) => {
+ fs.writeFileSync(`./node_modules/${bsDep}/index.js`, "");
+ const json = require(`./node_modules/${bsDep}/package.json`);
+ json.main = "index.js";
+ fs.writeFileSync(
+ `./node_modules/${bsDep}/package.json`,
+ JSON.stringify(json, null, 2)
+ );
+ });
+}
+patchResDeps(); // update package.json and create empty `index.js` before transpiling
+
+module.exports = withTM({
+ pageExtensions: ['jsx', 'js', 'mjs'],
+})
diff --git a/examples/with-rescript/package.json b/examples/with-rescript/package.json
new file mode 100644
index 0000000000000..75bfb2281963f
--- /dev/null
+++ b/examples/with-rescript/package.json
@@ -0,0 +1,23 @@
+{
+ "name": "with-reasonml",
+ "version": "1.0.0",
+ "scripts": {
+ "dev": "next",
+ "watch": "rescript build -w",
+ "dev:next": "next dev",
+ "build": "rescript && next build",
+ "start": "next start"
+ },
+ "license": "MIT",
+ "dependencies": {
+ "next": "latest",
+ "react": "^16.13.1",
+ "react-dom": "^16.13.1"
+ },
+ "devDependencies": {
+ "@babel/core": "^7.8.4",
+ "next-transpile-modules": "7.0.0",
+ "@rescript/react": "^0.10.1",
+ "rescript": "^9.1.2"
+ }
+}
diff --git a/examples/with-rescript/pages/about.js b/examples/with-rescript/pages/about.js
new file mode 100644
index 0000000000000..edab3cf60b48c
--- /dev/null
+++ b/examples/with-rescript/pages/about.js
@@ -0,0 +1,12 @@
+import AboutRes from "src/About.bs.js";
+
+// Note:
+// We need to wrap the make call with
+// a Fast-Refresh conform function name,
+// (in this case, uppercased first letter)
+//
+// If you don't do this, your Fast-Refresh will
+// not work!
+export default function About(props) {
+ return ;
+}
diff --git a/examples/with-rescript/pages/index.js b/examples/with-rescript/pages/index.js
new file mode 100644
index 0000000000000..787f644e187e6
--- /dev/null
+++ b/examples/with-rescript/pages/index.js
@@ -0,0 +1,15 @@
+import IndexRes from "src/Index.bs.js";
+
+// This can be re-exported as is (no Fast-Refresh issues)
+export { getServerSideProps } from "src/Index.bs.js";
+
+// Note:
+// We need to wrap the make call with
+// a Fast-Refresh conform function name,
+// (in this case, uppercased first letter)
+//
+// If you don't do this, your Fast-Refresh will
+// not work!
+export default function Index(props) {
+ return ;
+}
diff --git a/examples/with-rescript/src/About.res b/examples/with-rescript/src/About.res
new file mode 100644
index 0000000000000..437b233578dfa
--- /dev/null
+++ b/examples/with-rescript/src/About.res
@@ -0,0 +1,5 @@
+@react.component
+let make = () =>
+