Pika/Pack is a new approach to npm package building

Pika/Pack is a new approach to npm package building
Average rating: 0
(0 votes)

Thanks! You’ve rated this material!

If you’ve recently published a package to npm, you know how much work goes into a modern build process. Transpile JavaScript, compile TypeScript, convert ES Module syntax (ESM) to Common.js, configure your package.json manifest, and that’s just the basics. But what about web browsers and bundlers? Don’t worry, we’ll try to help you. Pika/Pack is a new approach to npm package building that can solve your problems.

@pika/pack connects pre-configured plugins to build and optimize your package for you. Plugins wrap already-popular tools like Babel and Rollup with options already optimized for npm. This lets @pika/pack build your package without much (if any) configuration required on your part.

This works because @pika/pack builds your entire package: code, assets, and even package.json manifest. By building the entire package, you end up with a fully-built pkg/ directory, ready to publish. Entry points like “main”, “module”, “umd:main”, “types”, “unpkg”, and even advanced options like “sideEffects” and “files” are all handled by your build plugins.

The first plugin that most packages will use is @pika/plugin-standard-pkg. This is our standard “source” builder that builds any JavaScript & TypeScript source code to the latest ES2018 language spec. After creating your modern ES2018 build, it becomes trivial to add Node.js- and web-optimized distributions to your package. @pika/plugin-build-node will transpile a Node.js-ready distribution to run on any supported Node.js version. With @pika/pack, every package automatically gets .d.ts TypeScript definition files thanks to the @pika/plugin-build-types plugin.

Find more examples here.

Don’t miss a chance to read about one of the most popular package managers – Software Galaxies. Every dot here is a package – ‘code galaxies’ visualization of npm packages.

Rate this article, if you like it

Thanks! You’ve rated this material!

Got a project? Let's discuss it!

*By submitting this form you agree with our Privacy Policy.

Mailing & Legal Address

Syndicode Inc. 340 S Lemon Ave #3299, Walnut CA, 91789, USA

Visiting & Headquarters address
Kyiv Sofiivska 1/2a, 01001, Kyiv, Ukraine
Dnipro Hlinky 2, of. 1003, 49000, Dnipro, Ukraine
Email info@syndicode.com
Phone (+1) 9035021111