Question

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

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

我的问题是如何导出此源代码以在少数朋友之间进行测试，以便在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

提前感谢您的想法。

干杯！

Answer 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 即可分发。

快乐编码每个人。！

导出/打包Firefox附加到Web扩展xpi

1 个答案: