Docs

Deploy a Chrome Extension to production

Warning

This guide assumes you are using the Plasmo framework. If you need help applying these concepts to another framework, contact support.

Create a production instance

For Clerk production instances, there must be a domain associated with the instance. Even though there may not be a web application associated with your Chrome Extension, a domain is still required. Follow the guide on deploying your Clerk app to production.

Update your .env.production file

.env.production
PLASMO_PUBLIC_CLERK_PUBLISHABLE_KEY=YOUR_PUBLISHABLE_KEY
CLERK_FRONTEND_API=YOUR_FRONTEND_API_URL
PLASMO_PUBLIC_CLERK_SYNC_HOST=https://yourdomain.com

Add production domain to host_permissions

host_permissions specifies which hosts, or websites, will have permission to sync auth state with your app. It accepts an array, allowing you to add more than one host. You must add your production domain to the host_permissions array.

Warning

If you are using the Sync Host feature and followed the configuration guide, then you have already completed this step (the http://$PLASMO_PUBLIC_CLERK_SYNC_HOST/* value points to your production domain.)

In the package.json file, in the manifest object, update the host_permissions array. Add your domain and ensure it is preceded with https://. For example, https://clerk.com. Only add the root domain and not any subdomains. Then, add /* to the end of the domain.

The following example shows how to configure host_permissions for production:

package.json
{
  // The rest of your package.json file
  "manifest": {
    "key": "$CRX_PUBLIC_KEY",
    "permissions": ["cookies", "storage"],
    "host_permissions": ["https://<yourdomain>/*", "$CLERK_FRONTEND_API/*"]
  }
}

Add the Extension's ID to your web app's allowed_origins

Warning

You may have already added the Extension ID to your web app's allowed_origins using your development secret key. You must repeat this step using your production secret key.

terminal
curl -X PATCH https://api.clerk.com/v1/instance \
  -H "Authorization: Bearer YOUR_SECRET_KEY" \
  -H "Content-type: application/json" \
  -d '{"allowed_origins": ["chrome-extension://<CHROME_EXTENSION_KEY>"]}'

Submit your extension for review

  1. In your app, create a new zip of the build/chrome-mv3-dev folder.
  2. In the top-right of the Chrome Web Store Developer Dashboard, select Upload new package and upload the zip file.
  3. Complete the required information to submit your extension for review. To check the requirements that must be met before submitting, select Why can't I submit?.

Feedback

What did you think of this content?
Edit this page on GitHub

Last updated on