How to write a multi-file NPM package with Brunch

Question

I have a multi-file project, with ES6 style exports and imports.

I'm using Brunch to concatenate these files into 1 main.js file that will serve as the main for an NPM package.

To specify the API of my package, I need to have exports in main.js. But when Brunch concatenates my js files, I am worried that (1) exports that are meant for internal imports and (2) exports meant for my API will both look the same.

Looking at the generated main.js file it seems like the exports I write in my source code get wrapped into modules, but none of these are top-level exports like the ones needed for NPM packages.

How can I let NPM distinguish between these two types of exports? Specifically, how can I have exports in the main.js file generated by Brunch concatenation?

Answer 1

Brunch is not designed for writing libraries, but rather for building apps.

I don't need to concatenate files at all to publish them to NPM, so instead I have used Babel with React and ES6 presets to transform my ES6 .jsx files to ES5 .js files.

I then make one file (eg. main.js) where I export my library and set that as the main in package.json.

I can then use Brunch to create an app with the React skeleton (brunch new -s brunch/with-react), npm install <my-package>, and import my library within my app.