Here is my package.json
{
"name": "team-member-allocation",
"version": "0.1.0",
"scripts": {
"clean": "rescript clean",
"build": "rescript build",
"watch": "rescript build -w"
},
"keywords": [
"ReScript"
],
"author": "",
"license": "MIT",
"devDependencies": {
"@rescriptbr/react-bootstrap": "github:rescriptbr/rescript-react-bootstrap",
"copy-webpack-plugin": "^11.0.0",
"css-loader": "^6.7.3",
"html-webpack-plugin": "^5.5.0",
"rescript": "^10.0.1",
"style-loader": "^3.3.1",
"webpack": "^5.75.0",
"webpack-cli": "^5.0.1",
"webpack-dev-server": "^4.11.1"
},
"dependencies": {
"@rescript/react": "^0.11.0",
"bootstrap": "^5.1.0",
"react-bootstrap": "^2.7.2"
}
}
and this is my bsconfig.json
{
"name": "team-member-allocation",
"version": "0.1.0",
"sources": {
"dir" : "src",
"subdirs" : true
},
"package-specs": {
"module": "es6",
"in-source": true
},
"suffix": ".bs.js",
"jsx": { "version": 4, "mode": "classic" },
"bs-dependencies": [
"@rescript/react",
"@rescriptbr/react-bootstrap"
],
"reason": {"react-jsx": 3}
}
When I try to compile my code I get an error in the source code of @rescriptbr/react-bootstrap
> team-member-allocation@0.1.0 build
> rescript build
Dependency on @rescript/react
Dependency on @rescriptbr/react-bootstrap
rescript: [1/10] src/Nav.ast
FAILED: src/Nav.ast
We've found a bug for you!
/Users/foo/code/Rescript/team-member-allocation/node_modules/@rescriptbr/react-bootstrap/src/Nav.res:17:3-20:18
15 │ ~onKeyDown: unit => unit=?,
16 │ ~variant: [#tabs | #pills],
17 │ ~className: string=?,
18 │ ~children: React.element,
19 │ ~bsPrefix: string=?,
20 │ ) => React.element = "Nav"
21 │
22 │ module Item = {
JSX: found the duplicated prop `className`
rescript: [2/10] src/Button.ast
FAILED: src/Button.ast
We've found a bug for you!
/Users/foo/code/Rescript/team-member-allocation/node_modules/@rescriptbr/react-bootstrap/src/Button.res:15:3-18:18
13 │ ~_type: buttonType=?,
14 │ ~variant: variant=?,
15 │ ~className: string=?,
16 │ ~children: React.element,
17 │ ~bsPrefix: string=?,
18 │ ) => React.element = "Button"
19 │
JSX: found the duplicated prop `className`
rescript: [3/10] src/Accordion.ast
FAILED: src/Accordion.ast
We've found a bug for you!
/Users/foo/code/Rescript/team-member-allocation/node_modules/@rescriptbr/react-bootstrap/src/Accordion.res:66:5-68:20
64 │ ~children: React.element,
65 │ ~className: string=?,
66 │ ~children: React.element,
67 │ ~bsPrefix: string,
68 │ ) => React.element = "Collapse"
69 │ }
70 │
JSX: found the duplicated prop `children`
FAILED: cannot make progress due to previous errors.
Failure: /Users/foo/code/Rescript/team-member-allocation/node_modules/rescript/darwin/ninja.exe
Location: /Users/foo/code/Rescript/team-member-allocation/node_modules/@rescriptbr/react-bootstrap/lib/bs
This is my Index.res file which imports rescript react bootstrap
Js.Console.log("came inside the main application")
%%raw("import ('bootstrap/dist/css/bootstrap.min.css')")
switch ReactDOM.querySelector("#main") {
| Some(rootElement) =>
ReactDOM.Client.Root.render(ReactDOM.Client.createRoot(rootElement), <Demo />)
| None =>
Js.Console.log("could not find main div")
()
}
and finally this is my code which is using react bootstrap
module Button = ReactBootstrap.Button
@react.component
let make = () => {
<div>
{"Hello World" -> React.string}
<Button variant="primary">{"Primary"->React.string}</Button>
<Button variant="secondary">{"Secondary"->React.String}</Button>
<Button variant="success">{"Success"->React.String}</Button>
<Button variant="warning">{"Warning"->React.String}</Button>
<Button variant="danger">{"Danger"->React.String}</Button>
<Button variant="light">{"Light"->React.String}</Button>
</div>
}
Here is my package.json
{ "name": "team-member-allocation", "version": "0.1.0", "scripts": { "clean": "rescript clean", "build": "rescript build", "watch": "rescript build -w" }, "keywords": [ "ReScript" ], "author": "", "license": "MIT", "devDependencies": { "@rescriptbr/react-bootstrap": "github:rescriptbr/rescript-react-bootstrap", "copy-webpack-plugin": "^11.0.0", "css-loader": "^6.7.3", "html-webpack-plugin": "^5.5.0", "rescript": "^10.0.1", "style-loader": "^3.3.1", "webpack": "^5.75.0", "webpack-cli": "^5.0.1", "webpack-dev-server": "^4.11.1" }, "dependencies": { "@rescript/react": "^0.11.0", "bootstrap": "^5.1.0", "react-bootstrap": "^2.7.2" } }and this is my bsconfig.json
{ "name": "team-member-allocation", "version": "0.1.0", "sources": { "dir" : "src", "subdirs" : true }, "package-specs": { "module": "es6", "in-source": true }, "suffix": ".bs.js", "jsx": { "version": 4, "mode": "classic" }, "bs-dependencies": [ "@rescript/react", "@rescriptbr/react-bootstrap" ], "reason": {"react-jsx": 3} }When I try to compile my code I get an error in the source code of @rescriptbr/react-bootstrap
> team-member-allocation@0.1.0 build > rescript build Dependency on @rescript/react Dependency on @rescriptbr/react-bootstrap rescript: [1/10] src/Nav.ast FAILED: src/Nav.ast We've found a bug for you! /Users/foo/code/Rescript/team-member-allocation/node_modules/@rescriptbr/react-bootstrap/src/Nav.res:17:3-20:18 15 │ ~onKeyDown: unit => unit=?, 16 │ ~variant: [#tabs | #pills], 17 │ ~className: string=?, 18 │ ~children: React.element, 19 │ ~bsPrefix: string=?, 20 │ ) => React.element = "Nav" 21 │ 22 │ module Item = { JSX: found the duplicated prop `className` rescript: [2/10] src/Button.ast FAILED: src/Button.ast We've found a bug for you! /Users/foo/code/Rescript/team-member-allocation/node_modules/@rescriptbr/react-bootstrap/src/Button.res:15:3-18:18 13 │ ~_type: buttonType=?, 14 │ ~variant: variant=?, 15 │ ~className: string=?, 16 │ ~children: React.element, 17 │ ~bsPrefix: string=?, 18 │ ) => React.element = "Button" 19 │ JSX: found the duplicated prop `className` rescript: [3/10] src/Accordion.ast FAILED: src/Accordion.ast We've found a bug for you! /Users/foo/code/Rescript/team-member-allocation/node_modules/@rescriptbr/react-bootstrap/src/Accordion.res:66:5-68:20 64 │ ~children: React.element, 65 │ ~className: string=?, 66 │ ~children: React.element, 67 │ ~bsPrefix: string, 68 │ ) => React.element = "Collapse" 69 │ } 70 │ JSX: found the duplicated prop `children` FAILED: cannot make progress due to previous errors. Failure: /Users/foo/code/Rescript/team-member-allocation/node_modules/rescript/darwin/ninja.exe Location: /Users/foo/code/Rescript/team-member-allocation/node_modules/@rescriptbr/react-bootstrap/lib/bsThis is my Index.res file which imports rescript react bootstrap
Js.Console.log("came inside the main application") %%raw("import ('bootstrap/dist/css/bootstrap.min.css')") switch ReactDOM.querySelector("#main") { | Some(rootElement) => ReactDOM.Client.Root.render(ReactDOM.Client.createRoot(rootElement), <Demo />) | None => Js.Console.log("could not find main div") () }and finally this is my code which is using react bootstrap
module Button = ReactBootstrap.Button @react.component let make = () => { <div> {"Hello World" -> React.string} <Button variant="primary">{"Primary"->React.string}</Button> <Button variant="secondary">{"Secondary"->React.String}</Button> <Button variant="success">{"Success"->React.String}</Button> <Button variant="warning">{"Warning"->React.String}</Button> <Button variant="danger">{"Danger"->React.String}</Button> <Button variant="light">{"Light"->React.String}</Button> </div> }