I am having difficulties setting up webpack for my reason app.
I successfully installed webpack using this command :
npm install --save-dev webpack
I also installed style-loader and css-loader using this command :
npm install --save-dev style-loader css-loader
Below is an excerpt from my package.json file :
"devDependencies": {
"bs-platform": "^4.0.18",
"css-loader": "^2.1.0",
"html-webpack-plugin": "^3.2.0",
"style-loader": "^0.23.1",
"sw-precache-webpack-plugin": "^0.11.5",
"webpack": "^4.29.3",
"webpack-cli": "^3.2.3",
"webpack-dev-server": "^3.1.14",
"webpack-pwa-manifest": "^4.0.0"
},
"dependencies": {
"react": "^16.8.1",
"react-dom": "^16.8.1",
"reason-react": ">=0.5.3"
}
Here is a snippet from my webpack.config.js file :
const outputDir = path.join(__dirname, 'build/');
module.exports = {
entry: './src/Index.bs.js',
mode: isProd ? 'production' : 'development',
output: {
path: outputDir,
filename: 'index.js',
publicPath: PUBLIC_PATH
},
module: {
rules: [{
test: /\.css$/,
use: [
{ loader: "style-loader" },
{ loader: "css-loader" }
]
}]
},
To load my css file, I added this command to my Index.re file :
[%raw {|require('../css/index.css')|}]
Here is the generated js file :
// Generated by BUCKLESCRIPT VERSION 4.0.18, PLEASE EDIT WITH CARE
'use strict';
var Component1 = require("./Component1.bs.js");
var ReactDOMRe = require("reason-react/src/ReactDOMRe.js");
var ReasonReact = require("reason-react/src/ReasonReact.js");
((require('../css/index.css')));
ReactDOMRe.renderToElementWithId(ReasonReact.element(undefined, undefined, Component1.make("Hello!", /* array */[])), "index1");
/* Not a pure module */
When I run webpack, there are no errors, but my css file is not generated in the "build" folder... Here are the folders in my project :