Bucklescript loader for Webpack
This library is in maintanence mode. Instead of using bs-loader we recommend using bsb' new in-source builds in conjunction with .bs.js extensions:
// bcsconfig.json { "package-specs": { "module": "commonjs", "in-source": true }, "suffix": ".bs.js", }
This works with both Reason and OCaml files
npm install bs-loader
First install bs-platform
into the project:
$ npm i -D bs-platform
Create a bsconfig.json
for Bucklescript:
/* bsconfig.json */ { "name": "hello", "sources": [ "src" ], "bs-dependencies": [ "reason-react" ], "reason": { "react-jsx": 2 } }
We will also need reason-react
, and bs-platform
. You can install bs-platform
globally and use npm link
to the link the binary, or install bs-platform
as a devDependency. Your package.json
should look something like this:
/* package.json */ { "name": "reason-webpack", "private": true, "version": "1.0.0", "description": "", "scripts": { "build": "webpack" }, "author": "", "license": "ISC", "devDependencies": { "bs-loader": "^1.0.0", "reason-react": "0.1.3", "webpack": "^2.2.1" }, "dependencies": { "react": "^15.4.2", "react-dom": "^15.4.2" } }
To use the loader you must:
- Register the
.re
and.ml
extensions with Webpack - Configure
.re
and.ml
to use the loader
An example config would look like:
// webpack.config.js const path = require('path') module.exports = { // Entry file can be a Reason or OCaml file entry: './src/entry.re', output: { filename: 'out.js', path: path.resolve(__dirname, 'build') }, module: { rules: [ // Set up Reason and OCaml files to use the loader { test: /\.(re|ml)$/, use: 'bs-loader' }, ] }, resolve: { // Add .re and .ml to the list of extensions webpack recognizes extensions: ['.re', '.ml', '.js'] } }
bs-loader
includes a transform for usage with Jest. This lets Jest run Reason and OCaml files as tests. An example Jest configuration using bs-loader
:
"jest": { "moduleFileExtensions": [ "re", "js", "ml" ], "testMatch": [ "**/src/*_test.re" ], "transform": { ".(re|ml)": "bs-loader" } }
Most of these settings are inferred from your bsconfig.json
. These are available for manual override, but might go away in the future.
To tell Webpack to load a module type that isn't JS (for example, amd
or goog
) give the loader a module
option. For example, to use AMD modules produced by Bucklescript, use the config
{ test: /\.(re|ml)$/, use: 'bs-loader?module=amd' }
To use bs-loader with bsb's in-souce builds, add the inSource
option to your loader config:
{ test: /\.(re|ml)$/, use: { loader: 'bs-loader', options: { module: 'es6', inSource: true } } }
This option specifies what directory to run bsb
from. For example, to run bsb
from the same directory as your webpack config, use:
{ test: /\.(re|ml)$/, use: { loader: 'bs-loader', options: { cwd: __dirname } } }
Controls whether bsb
compile warnings are shown. Defaults to true
.