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"

See with-google-analytics (opens in a new tab)