How to use JS functions/variables defined in another file?


#1

Currently I have a file src/index.re. I also have a file src/util.js which defines some helper functions I’d like to use. How do I use those functions in src/index.re?


#2

Hello! See the docs here: https://bucklescript.github.io/docs/en/import-export.html

If you can’t figure out, list a few things you’d like to use from util.js here!


#3

I am having some difficulty understanding the examples on the page you linked to. The first example:

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';

Is this a typographical error, or does name somehow get translated to studentName? (Also, these are both .js files, so Bucklescript/ReasonML is not even involved at this point, if I understand correctly.)

In the second example, would FavoriteStudent.ml compile to FavoriteStudent.js or FavoriteStudent.bs.js? Further:

(* FavoriteStudent.ml *)
let default = "Bob"

You can then require the default as normal JS side:

// teacher2.js
import studentName from 'FavoriteStudent.js';

How does default get translated to studentName for the import?


#4

I think this is the confusing thing with default import/export. In a nut shell, default import/export couldbe re-written like this (this is not entirely correct according to the specs IIRC)

// student.js
export { name as default } = "Al";

// teacher.js
import { default as studentName } from 'student.js';

#5

Ah, OK. After reading the description of import and export at https://developer.mozilla.org/, it makes more sense, as there can be only one default Is it normally the case that modules have only one export? (I find that surprising, but then again, it doesn’t take much to surprise me.)


#6

default is just a special named export. You can have multiple exports