将 Firefox 附加组件导出/打包到 Web 扩展 xpi答案

【问题标题】：Exporting/Packaging Firefox add-on to web extension xpi将 Firefox 附加组件导出/打包到 Web 扩展 xpi
【发布时间】：2017-08-06 14:46:12
【问题描述】：

我最近正在研究 Firefox 网络扩展开发，因此我之前没有扩展开发技能，如果这是一个愚蠢的问题，请提前接受我的道歉。

我开发了一个扩展来操作某个域中的某些元素。它在Firefox about:debugging 环境中运行良好。我只使用 jQuery 和 Javascript 来操作我在 DOM 上的设置。未使用任何 SDK 或 XUL。 storage.local 和 browser tabs API 用于存储和传输我的数据。

我的问题是如何导出此源代码以在少数朋友中进行测试，以在AMO 签名之前验证功能，我在这里的方法是对还是错。

manifest.json

{
    "content_scripts": [
        {
            "matches": [
                "*://*.domain.com/*"
            ], 
            "run_at": "document_start", 
            "js": [
                "jquery.js", 
                "flat_ui_min.js", 
                "application.js"
            ]
        }
    ], 
    "name": "Extension name goes here", 
    "icons": {
        "48": "icons/extension-icon-48.png"
    }, 
    "description": "Sample description goes here", 
    "homepage_url": "URL to the extension info", 
    "version": "1.2", 
    "manifest_version": 2, 
    "browser_action": {
        "default_icon": {
            "32": "icons/browser-icon-32.png"
        }, 
        "browser_style": true, 
        "default_title": "Extension short name", 
        "default_popup": "popup/layout.html"
    }, 
    "permissions": [
        "activeTab", 
        "storage", 
        "tabs"
    ]
}

install.rdf

<?xml version="1.0"?>
<RDF xmlns="http://www.w3.org/1999/02/22-rdf-syntax-ns#" xmlns:em="http://www.mozilla.org/2004/em-rdf#">
  <Description about="urn:mozilla:install-manifest">

    <em:id>name@domain.org</em:id>

    <em:type>2</em:type>

    <em:name>Extension name</em:name>

    <em:version>1.2</em:version>

    <em:description>Extension description</em:description>

    <em:creator>Creator's name</em:creator>

    <em:homepageURL>Extension homepage</em:homepageURL>

    <em:optionsType>1</em:optionsType>

    <em:targetApplication>
      <Description>
        <em:id>Some random string</em:id>
        <em:minVersion>46.0</em:minVersion>
        <em:maxVersion>57.*</em:maxVersion>
      </Description>
    </em:targetApplication>
  </Description>
</RDF>

目录结构

Extension Folder
    └─── install.rdf
    └─── manifest.json
    └─── jquery.js
    └─── application.js
    └─── flat_ui_min.js
    └─── popup/
            └─── css/
                  └─── bootstrap.min.css
                  └─── flat-ui.min.css
                  └─── style.css
            └─── fonts/
                  └─── glyphicons/
                  └─── lato/
            └─── layout.html
    └─── icons/
            └─── browser-icon-32.png
            └─── browser-icon-48.png

提前欣赏你的想法。

干杯！

【问题讨论】：

正如你所提到的，你还没有得到 Mozilla 的签名，所以你应该使用about:debugging，而不是about:addons。请参阅：Firefox extension .xpi file structure: description, contents, creation, and installation 以获取有关打包附加组件的信息，Add-on "appears to be corrupt" when trying to install my add-on's .xpi file in Firefox 专门针对“似乎已损坏”的最常见原因。然而，我们真的无法回答任何问题，除了猜测/一般信息而没有实际访问权限
您应该在提交之前使用 .xpi 文件将其安装为about:debugging 的临时插件。除了将其提交给 AMO 之外，没有其他方法可以对其进行签名。允许从 about:addons 安装未签名插件的唯一方法是运行 Nightly 或 Developer Edition，或者完全禁用插件签名要求（可以在每个 Firefox 安装的基础上完成；请参阅： How can I disable signature checking for Firefox add-ons?)
正如我所说，WebExtensions 不使用 install.rdf 文件。
提交给 AMO 由您决定。如果您要分发它，这是一个必需的步骤。在提交之前，您已经完成了最重要的部分：功能扩展包。
我很高兴能够提供帮助。祝你好运

标签： firefox-addon firefox-addon-webextensions

【解决方案1】：

SO 用户 makyen 已经给出了他的想法和想法，让这个扩展测试符合我的标准。在这里发布这些作为答案是为了作为其他初学者开发人员解决我的问题的指南。

进行了以下更改：

manifest.json的新设置

{
    "description": "brief intro about the extension",
    "manifest_version": 2,
    "version": "1.2",
    "name": "Extension name",
    "homepage_url": "Developer or extension website",
    "icons": {
        "32": "icons/browser-icon-32.png",
        "48": "icons/browser-icon-48.png",
        "96": "icons/browser-icon-96.png",
        "128": "icons/browser-icon-128.png"
    },    
    "content_scripts": [
        {
            "js": [
                "jquery.js",
                "flat_ui_min.js",
                "application.js"
            ],
            "matches": [
                "*://*.somedomain.com/*",
                "*://*.somedomain.org/*"
            ]
        }
    ],
    "browser_action": {
        "default_title": "Extension browser title",
        "default_popup": "popup/layout.html",
        "browser_style": true,
        "default_icon": {
            "32": "icons/browser-icon-32.png"
        }
    },
    "permissions": [
        "activeTab",
        "storage",
        "tabs"
    ]
}

我删除了 install.rdf 因为网络扩展不需要一个。在打包扩展时，请关注此guide。更多信息可以在here找到。

之后，只需将文件扩展名从 filename.zip 更改为 filename.xpi 即可分发。

祝大家编码愉快！

【讨论】：