Importing Remote Code
Plasmo automatically bundles all import statements that point to a remote resource using the https
protocol in build time. This is essential to work with the remote code restriction in Manifest V3 (opens in a new tab).
Adding the Google Analytics 4 (opens in a new tab) tracking code into our popup is as simple as:
import "https://www.googletagmanager.com/gtag/js?id=XXXXXX"
The code above is not clean due to the presence of the tracking ID. However, since Plasmo parses the import statement, we can use environment variables inside the import. Define the tracking ID in a .env.local
file:
PLASMO_PUBLIC_GTAG_ID=XXXXXX
Then, use it in your import by prefixing a $
before its name:
import "https://www.googletagmanager.com/gtag/js?id=$PLASMO_PUBLIC_GTAG_ID"