I've been working on a way to make it easier to push content into my static site
and it's been a fun little exercise that I will share more in another post. In
this post I want to share the
rollup config that I used to import nearly any
I needed a quick way import a simple module
get-urls into my project. The
module is well tested and it does what I needed ... ignore the fact that it's
is that my project is built in ES6, uses modules and I didn't want to have to
bundle up using CommonJS (
I couldn't find a lot of guidance on what to do here, so I went to experiement and this solution is the solution I came across:
- Create a file that imports the npm module I needed.
module.exports = require('get-urls');This module will be what's converted to ES6 style.
- Create a rollup config that
- Imports the node globals, and builtins.
- Resolves all npm modules required for my usage of this module.
- Pass the results through the
- Compress the output, because it's huge :\
- Include the bundled file in your project and rejoice.
I think there are probably better ways than this, the output for what is a relatively simple function is huge (70kb), but it now means that I can use modules from npm directly in my page.
About Me: Paul Kinlan
I lead the Chrome Developer Relations team at Google.
We want people to have the best experience possible on the web without having to install a native app or produce content in a walled garden.
Our team tries to make it easier for developers to build on the web by supporting every Chrome release, creating great content to support developers on web.dev, contributing to MDN, helping to improve browser compatibility, and some of the best developer tools like Lighthouse, Workbox, Squoosh to name just a few.