Skip to content

Rollup Use

Ognen Ivanovski edited this page Oct 23, 2019 · 2 revisions

Packaging and use of Rollup

During Develoopment

During development, each package.json is configured in the following way:

  • main points to index.js
  • index.js does export * from 'src'
  • type: "module" -- i.e. node is instructed to treat the package as a es6 modules based package.

The aim to be able to work on the packages as "close to the metal as possible". Jest is instructed to pull 'babel' for non-standard language features. Instruction for using modules interactively is preovided.

As Package from NPM

When packaging for publishing the following happens:

  • a dist/ folder is created and all publsihed files are copied into it

  • rollup is used to build

    • dist/index.mjs
    • dist/index.dev.mjs
    • dist/index.production.js (cjs module)
    • dist/index.dev.js (cjs module)
  • dist/index.mjs:

export * from './index.production.js'
  • index.js:
if (process.env.NODE_ENV === 'production') {
  module.exports = require('./index.production.js')
} else {
  module.exports = require('./index.dev.js')
}
  • package.json is copied into dist with the following modifications

    • main points to just index
    • module points to index.mjs
    • react-native points to index.js
    • type: module is removed

    The idea is that separate dev bundles are used when NODE_ENV is not production. These bundles contain runtime checks and assertions that assist the user.

Developer bundles with ES6 module resolution

Since ES6 modules rely on static code analysis, we are not able to do the dev/production switch in the index file needs to happen during module resolution.

This means:

  • for rollup, configuring rollup-plugin-node-resolve to prefer .dev.js over .js when NODE_ENV === 'production'
  • for node we use --experimental-modules and --experimental-loader to add the override.

Working with node interactively

When developing the library, it's best to use @babel/node:

$ npx babel-node --experimental-modules --es-module-specifier-resolution=node