启动开发服务器

完成项目设置后，通过导航到项目目录并运行以下命令开始开发扩展：

pnpm dev
# 或者
npm run dev
# 或者
plasmo dev

Plasmo 将为您的扩展创建一个开发包，并启动一个实时重新加载的开发服务器。每当文件发生变化时，它会自动更新扩展包，并在源代码更改时重新加载浏览器。此外，它会在扩展名称前加上 DEV |，并将图标变为灰度，以区分开发和生产环境的扩展包。

加载扩展

我们计划在未来实现自动化，但目前需要按照以下步骤将扩展加载到 Chrome 中。

转到 chrome://extensions 并启用开发者模式。

点击“加载已解压的扩展”并导航到扩展的 build/chrome-mv3-dev（或 build/chrome-mv3-prod）目录。

要查看弹出窗口，请点击 Chrome 工具栏上的拼图图标，然后点击您的扩展。

提示： 通过点击固定按钮，将扩展固定到 Chrome 工具栏以方便访问。

指定目标

使用 Plasmo 构建时，您构建的是一个 Plasmo 扩展，而不是 Chrome 或 Firefox 扩展。这意味着您可以构建一个适用于所有支持浏览器的单一扩展，只需进行少量调整。您可以使用 --target 标志指示 Plasmo 为特定浏览器和清单版本构建扩展：

plasmo dev --target=firefox-mv2

最终的包将位于 build/firefox-mv2-dev 目录中。

有关官方支持的目标列表，请访问此链接。

禁用sourcece-maps

默认情况下，Plasmo 在开发期间为您的扩展生成sourcece-maps。如果需要禁用此功能，可以使用 --no-source-maps 标志：

plasmo dev --no-source-maps

当您有与sourcece-maps不兼容的依赖项时，这非常有用。

指定主机名和端口

开发服务器默认绑定到 localhost 和端口 1012。您可以使用 --serve-host 和 --serve-port 更改这些设置：

plasmo dev --serve-host=localhost --serve-port=1012

同样，默认情况下，热模块重载 WebSocket 绑定到 localhost 和端口 1815，构建报告器绑定到 HMR 套接字 + 1（默认为 1816）。您可以使用 --hmr-host 和 --hmr-port 更改这些设置：

plasmo dev --hmr-host=localhost --hmr-port=1815