RollupJS is a build tool that allows us to prepare our applications in different ways, depending on the environment. There have been many tools before it (Grunt, Gulp), many that are competing with it (Webpack, Parcel), and many that will be built in the future. We will focus on RollupJS for our specific use case (getting our static server application built in Chapter 9, Practical Example – Building a Static Server), but just note that most build tools are similar in terms of their architecture.
What RollupJS gives us is a way to have hooks into different parts of the build life cycle. Most applications have the following states during a build process:
- Build start
- Dependency injection
- Compilation
- Post compilation
- Build end
Each of these states may go by different names in different build systems, and some may even have more than just these (as we will see, RollupJS does), but this is the typical build system.
In most cases, we will need to do the following things for our JavaScript applications:
- Bring in any dependencies that our Node/browser side needs
- Compile our JavaScript to a single file (if targeting HTTP/1) or compile it to an earlier version (if we are targeting wider browser support)
- Compile CSS to a single file, move images around, and so on
In the case of our application, we will make this quite easy. Here, we will learn how to do the following:
- Build our Node.js code into a single distributable
- Prepare our static assets, such as CSS/images
- Add Rollup to our npm build process