本教程的目标是从空目录开始生成 Microsoft Edge 扩展。 你正在构建一个扩展，弹出美国宇航局当天的照片。 本教程介绍如何通过以下方式创建扩展：
创建
manifest.json
文件。
添加图标。
打开默认弹出对话框。
若要测试在本教程中构建的已完成扩展，请从
MicrosoftEdge-Extensions 存储库 > 扩展-getting-started-part1
下载源代码。 源代码已从清单 V2 更新到清单 V3。
步骤 1：创建 manifest.json 文件
每个扩展包必须在根目录中有一个
manifest.json
文件。 清单提供了扩展、扩展包版本、扩展名称和说明等的详细信息。
以下代码概述了文件中所需的
manifest.json
基本信息：
清单 V3
清单 V2
"version": "0.0.0.1",
"manifest_version": 3,
"description": "An extension to display the NASA picture of the day."
"version": "0.0.0.1",
"manifest_version": 2,
"description": "An extension to display the NASA picture of the day."
"version": "0.0.0.1",
"manifest_version": 3,
"description": "An extension to display the NASA picture of the day.",
"icons": {
"16": "icons/nasapod16x16.png",
"32": "icons/nasapod32x32.png",
"48": "icons/nasapod48x48.png",
"128": "icons/nasapod128x128.png"
"version": "0.0.0.1",
"manifest_version": 2,
"description": "An extension to display the NASA picture of the day.",
"icons": {
"16": "icons/nasapod16x16.png",
"32": "icons/nasapod32x32.png",
"48": "icons/nasapod48x48.png",
"128": "icons/nasapod128x128.png"
步骤 3：打开默认弹出对话框
现在，创建一个
HTML
在用户启动扩展时要运行的文件。 在名为
popup.html
的目录中创建名为 的
popup
HTML 文件。 当用户选择图标以启动扩展时，
popup/popup.html
将显示为模式对话框。
将以下列表中的代码添加到 以显示
popup.html
星形图像：
<html lang="en">
<meta charset="UTF-8" />
<title>NASA picture of the day</title>
</head>
<img src="/images/stars.jpeg" alt="Display the stars image" />
</body>
</html>
确保将图像文件 images/stars.jpeg 添加到 images 文件夹。 项目的目录应类似于以下结构：
└── part1
├── manifest.json
├── icons
│ ├── nasapod16x16.png
│ ├── nasapod32x32.png
│ ├── nasapod48x48.png
│ └── nasapod128x128.png
├── images
│ └── stars.jpeg
└── popup
└── popup.html
最后，在 manifest.json 清单 V2) (下 browser_action 或在清单 V3) 中的 (下 action 注册弹出窗口，如以下代码所示：
清单 V3
清单 V2
"version": "0.0.0.1",
"manifest_version": 3,
"description": "An extension to display the NASA picture of the day.",
"icons": {
"16": "icons/nasapod16x16.png",
"32": "icons/nasapod32x32.png",
"48": "icons/nasapod48x48.png",
"128": "icons/nasapod128x128.png"
"action": {
"default_popup": "popup/popup.html"
"version": "0.0.0.1",
"manifest_version": 2,
"description": "An extension to display the NASA picture of the day.",
"icons": {
"16": "icons/nasapod16x16.png",
"32": "icons/nasapod32x32.png",
"48": "icons/nasapod48x48.png",
"128": "icons/nasapod128x128.png"
"browser_action": {
"default_popup": "popup/popup.html"
