Import & Export
Export
BuckleScript allows compiling to:
- CommonJS (
require('myFile')
) - ES6 modules (
import * from 'myFile'
)
The output format is configurable in bsb, described in a later section.
By default, every let
binding is exported. If their values are safe to use on the JS side, you can directly require the generated JS file and use them (see the JS file itself!).
To only export a few selected let
s, simply add an interface file that hides some of the let bindings.
Export an ES6 default value
If your JS project is using ES6 modules, you're likely exporting & importing some default values:
// student.js
export default name = "Al";
// teacher.js
import studentName from 'student.js';
Technically, since a BuckleScript file maps to a module, there's no such thing as "default" export, only named ones. However, we've made an exception to support default module when you do the following:
(* FavoriteStudent.ml *)
let default = "Bob"
/* FavoriteStudent.ml */
let default = "Bob"
You can then require the default as normal JS side:
// teacher2.js
import studentName from 'FavoriteStudent.js';
Note: the above JS snippet only works if you're using that ES6 import/export syntax in JS. If you're still using require
, you'd need to do:
let studentName = require('FavoriteStudent').default;
Import
Use bs.module
. It's like a bs.val
that accepts a string that's the module name or path.
external dirname: string -> string = "dirname" [@@bs.module "path"]
let root = dirname "/User/chenglou"
[@bs.module "path"] external dirname : string => string = "dirname";
let root = dirname("/User/chenglou");
Output:
var Path = require("path");
var root = Path.dirname("/User/chenglou");
Note: the string inside bs.module
can be anything: "./src/myJsFile"
, "@myNpmNamespace/myLib"
, etc.
Import a Default Value
By omitting the payload to bs.module
, you bind to the whole JS module:
external leftPad: string -> int -> string = "./leftPad" [@@bs.module]
let paddedResult = leftPad "hi" 5
[@bs.module] external leftPad : string => int => string = "./leftPad";
let paddedResult = leftPad("hi", 5);
Output:
var LeftPad = require("./leftPad");
var paddedResult = LeftPad("hi", 5);
Import an ES6 Default Value
This is a recurring question, so we'll answer it here. If your JS project is using ES6, you're likely using Babel to compile it to regular JavaScript. Babel's ES6 default export actually exports the default value under the name default
. You'd bind to it like this:
external studentName: string = "default" [@@bs.module "./student"]
let _ = Js.log studentName
[@bs.module "./student"] external studentName : string = "default";
Js.log(studentName);
Output:
var Student = require("./student");
console.log(Student.default);