Comment on page
For instance, it allows you to easily include third-party libraries, like screeps-profiler. Instead of manually copy-pasting these libraries into your code, you can simply install it as an
npm install screeps-profiler
Then you can import these libraries just like you would any other
npmmodule. When you run the module bundler, it will bundle up all your files and third-party modules into one single JS file.
Some module bundlers even support performing further optimisations like eliminating unused module functions from your final bundled code (aka. tree-shaking), reducing the size of your final bundled JS even further.
From version 3.0 onwards, the starter kit uses Rollup as its main module bundler. Some useful features of Rollup include:
- Bundled modules are entirely flat (no weird boilerplate code emitted like in Webpack)
- Advanced tree-shaking (eliminates unused modules from the final bundle)
- Simpler configuration (compared to Webpack)
By default, Rollup recognises ES6 modules. This means that some adjustments are necessary in order for Rollup to work well with CommonJS modules, particularly those with named exports like
screeps-profiler. (See #77)
In this case, you will have to manually specify the named exports you use, which is where the
rollup-plugin-commonjsplugin comes into play. This plugin resolves any CommonJS modules and converts them to ES6 modules, which can be bundled.
Simply include the modules you want to bundle complete with its named exports, like so:
// left-hand side can be an absolute path, a path
// relative to the current directory, or the name
// of a module in node_modules