How To Use NPM Packages On Codepen

Getting NPM Packges In Your Pens

Codepen is the place where I go to boilerplate ideas quickly. It is usually the first place I go when I start a project or an idea. But, sometimes you want to hack with some NPM packages before you move them into your main projects for further development.

UNPKG

Unpkg is a CDN for all of the packages on NPM. Any easy way to access them is simply be referencing a file like this.

[https://unpkg.com/[email protected]/umd/react.production.min.js] ` That will give you access to a certain file and a certain version that you are seeking out.

UNPKG has a ton of different options to references files and access them.

Node Modules

If you are using Codepen Projects, you can use a nodemodules folder and put your files inside of that. Then you can import them like normal in your other js files.

Published by and tagged codepen and npm using 140 words.