Skip to content
Artwork for CodePen Radio
CodePen Radio · April 14

422: Supporting Packages

Alex and Chris talk about how the 2.0 Editor supports packages from npm. The trick is both simple and complex. The idea is simple. We detect the packages you want to use, list them in an (editable) package.json file, then turn that into a <script type="importmap"> in your HTML files that import those packages from esm.sh. Complex in that, well, all those steps are fairly difficult to get right, handle all edge cases, and do extremely quickly. All of which the CodePen Compiler does. Time Jumps

0:00Duration unknown

transcript

No transcript — this publisher did not publish one.

show notes

Alex and Chris talk about how the 2.0 Editor supports packages from npm. The trick is both simple and complex. The idea is simple. We detect the packages you want to use, list them in an (editable) package.json file, then turn that into a <script type="importmap"> in your HTML files that import those packages from esm.sh. Complex in that, well, all those steps are fairly difficult to get right, handle all edge cases, and do extremely quickly. All of which the CodePen Compiler does.

Time Jumps

links3