• Workflows
• Create a New Extension

Create a New Extension

To run the interactive initialization wizard, use the following command:

pnpm create plasmo
# OR
yarn create plasmo
# OR
npm create plasmo

To skip the naming prompt, supply a name as a positional argument:

pnpm create plasmo "My Awesome Extension"
# OR
yarn create plasmo "My Awesome Extension"
# OR
npm create plasmo "My Awesome Extension"

With specific entry files

The default project contains just a popup entry file. However, you can customize this behavior by using the entry parameter with a comma-separated list of entry files to include in your initial project.

To see every available entry file, check this directory.

To use this flag, pick the entry files you would like to see in your project, omits its extension, and supply it to the --entry flag:

pnpm create plasmo --entry=options,newtab,content/inline
# OR
npm create plasmo -- --entry=options,newtab,content/inline

The command above will create a project with the options page, a newtab page, and an inline content script UI.

With an example template

Even more powerful, plasmo can create a new project based on a project in our examples. Pick an example you would like to use, and use it as a flag when running the create plasmo command:

pnpm create plasmo --with-env
# OR
npm create plasmo -- --with-env

The above will generate a project using the with-env example under the name you will provide.

Loading the extension

We plan to automate this in the future, but for the time being, these are the steps you need to take to load your extension in Chrome.

Head over to chrome://extensions and enable Developer Mode.

Click on "Load Unpacked" and navigate to your extension's build/chrome-mv3-dev (or build/chrome-mv3-prod) directory.

To see your popup, click on the puzzle piece icon on the Chrome toolbar, and click on your extension.

Pro tip: Pin your extension to the Chrome toolbar for easy access by clicking the pin button.