I’m trying to follow instructions for making a Rescript/React project, starting here: Installation | React , and then here : Installation | ReScript Language Manual as a kind of subroutine, and I need help making it work.
I apologize for the length of this note, but I wanted to be sure to include everything I tried, and exactly how it failed. Just in case it matters, I’m using MacOS 12.0.1.
Before I get into details, though:
When I’m done, I want to use the ReProcessing module, which is written in Reason rather than ReScript, and I I’d like to write my program that uses ReProcessing (or the fork of it found here: https://github.com/RawToast/reprocessing) in Reason rather than ReScript if possible. I worry that this Reason program will not be able to use React if it’s the ReScript version that I’ve installed. So my preliminary question is really this:
- Can I use a Reason module as part of a ReScript project?
- Can I write a Reason program as part of my project and connect with the ReScript/React stuff installed by following the instructions above?
- The Reprocessing project uses a bunch of “bsb”-type things to compile. Do I just replace “bsb” with “rescript” to make it work?
Assuming the answers to those three questions are “yes”, or something like it, here’s how the installation went, along with some confusion along the way. I apologize in advance for not understanding the whole “build” process in Reason/ReScript. I’ve tried to make sense of it, and failed.
Starting at https://rescript-lang.org/docs/react/latest/installation, I’m given “requirements”:
-
rescript@9.1.2or later (alternatively for older codebases:bs-platform@8.3 or later) -
react@16.8.1or later
but no suggestion about how to meet them. One possibility is the install them globally, another is to install them for this project. I’m going to guess the latter. The first step seems to be to create a ReScript project using instructions here: Installation | ReScript Language Manual ; these require “node” and “npm”.
`
% node --version
v16.13.2
% npm --version
8.1.2
Then
% git clone https://github.com/rescript-lang/rescript-project-template
% cd rescript-project-template
% npm install
Cloning into 'rescript-project-template'...
[...]
found **0** vulnerabilities
% npm run build
> rescript-project-template@0.0.1 build
> rescript
rescript: [3/3] src/Demo.cmj
% node src/Demo.bs.js
Hello, World!
Looking good so far. Returning to the previous page, I need to install rescript@9.1.2 and react@16.8.1:
% npm install rescript@9.1.2
changed 1 package, and audited 2 packages in 5s
found **0** vulnerabilities
% npm install react@16.8.1
added 7 packages, and audited 9 packages in 1s
found **0** vulnerabilities
Then I’m told to “Add following dependency to your ReScript project”, but it appears that what’s meant is "type the following command, which will add a dependency to your package.json file after ". And right here, things go off the rails:
% npm install @rescript/react --save
npm ERR! code ERESOLVE
npm ERR! ERESOLVE unable to resolve dependency tree
npm ERR!
npm ERR! While resolving: **rescript-project-template**@**0.0.1**
npm ERR! Found: **react**@**16.14.0**
npm ERR! node_modules/react
npm ERR! **react**@"**^16.8.1**" from the root project
npm ERR! peer **react**@"**>=16.8.1**" from **@rescript/react**@**0.10.3**
npm ERR! node_modules/@rescript/react
npm ERR! **@rescript/react**@"*****" from the root project
npm ERR!
npm ERR! Could not resolve dependency:
npm ERR! peer **react**@"**17.0.2**" from **react-dom**@**17.0.2**
npm ERR! node_modules/react-dom
npm ERR! peer **react-dom**@"**>=16.8.1**" from **@rescript/react**@**0.10.3**
npm ERR! node_modules/@rescript/react
npm ERR! **@rescript/react**@"*****" from the root project
npm ERR!
npm ERR! Fix the upstream dependency conflict, or retry
npm ERR! this command with --force, or --legacy-peer-deps
npm ERR! to accept an incorrect (and potentially broken) dependency resolution.
npm ERR!
npm ERR! See /Users/jfh/.npm/eresolve-report.txt for a full report.
npm ERR! A complete log of this run can be found in:
npm ERR! /Users/jfh/.npm/_logs/2022-02-09T20_08_51_074Z-debug.log
Making a best-guess attempt, I figured I’d try installing react@17.0.2, because that was the largest number I saw in the error report:
npm install react@17.0.2
removed 3 packages, changed 1 package, and audited 6 packages in 1s
found **0** vulnerabilities
and then once again try the previous step:
% npm install @rescript/react --save
added 3 packages, and audited 9 packages in 995ms
found **0** vulnerabilities
OK. Success (maybe); perhaps someone needs to edit those “how to get started” docs, though.
I edited my bsconfig.json file as instructed and created Test.res in the source directory:
% cat > src/Test.res
// src/Test.res
@react.component
let make = () => {
<div> {React.string("Hello World")} </div>
}
I’m then told to run npx rescript and I should see a successful build.
% npx rescript
**Different compiler version**: clean current repo
Cleaning... 5 files.
Dependency on @rescript/react
rescript: [38/38] src/legacy/ReactDOMRe.cmj
rescript: [49/49] install.stamp
Dependency Finished
rescript: [5/6] src/Test.cmj
FAILED: src/Test.cmj
**We've found a bug for you!**
/Users/jfh/Desktop/example/rescript-project-template/src/Test.res:4:4-6
2 │ @react.component
3 │ let make = () => {
**4** │ <**div**> {React.string("Hello World")} </div>
5 │ }
6 │
The value div can't be found
rescript: [6/6] src/Demo.cmj
FAILED: cannot make progress due to previous errors.
…and with that, my ReScript/React adventure has ground to a halt.
Any suggestions? Did I do something wrong?
–John