import React from "https://cdn.skypack.dev/react", a valid ES module served by Skypack.
But who wants to remember to type that out? Certainly not me! The good news is we offer some helpers to get imports working in your Pens.
Automatically Fixing Imports
Whenever you type out an
import statement that isn’t a valid ES Module import, we offer to replace those with Skypack imports. This comes in really handy if you copy and paste some code from a tutorial, and gets those imports working without the hassle of installing packages and running a bundler!
This helpful feature works in both the Pen and Project editor. We automatically add
<script type="module"> in Pens to get ES Modules working, but don’t forget to add that yourself in Projects!
If you think your
import shouldn’t be messed with, click “Ignore” and we won’t prompt you about imports anymore while you edit that Pen or Project.
Searching and Adding Packages
import statement to your code!