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
- 00:00:06 Packages! Packages! Packages!
- 00:01:21 CodePen 2.0 editor handles packages for you
- 00:02:34 How it works now
- 00:09:44 How things used to work
- 00:17:21 How we tried to be ESM
- 00:24:03 Current limitations of this set up
- 00:27:55 Shoutout to jsDelivr
Video Subscribe on YouTube