-2

我正在尝试使用WebExtensions API将 Chrome 扩展移植到 Firefox 插件。我正在使用RequireJS加载 JavaScript 文件。下面的代码在我的 Chrome 扩展程序中运行良好，但在 Firefox 中运行良好。

有人对此有什么建议吗？谢谢。

清单.json：

{
"name": "Firefox WebExtension",
"version": "0.0.5",
"manifest_version": 2,
"description": "First Firefox WebExtensions",

"icons": {
    "16": "img/c-ext3.png",
    "48": "img/c-ext3.png",
    "128": "img/c-ext3.png"
},
"background": {
    "scripts": [
        "js/vendor/require.js", "js/config/loader.js", "js/config/requireInit.js"
    ]
},
"applications": {
    "gecko": {
        "id": "abc@mozilla.org",
        "strict_min_version": "44.0",
        "strict_max_version": "50.*"
    }
},
"browser_action": {
    "default_icon": "img/c-ext3.png",
    "default_title": "Firefox WebExtension",
    "default_popup": "src/browser_action/browser_action.html"
},

"permissions": [
    "contextMenus",
    "cookies",
    "http://*/*", "https://*/*", "file://*/*",
    "notifications",
    "tabs",
    "<all_urls>"
],

"content_security_policy": "script-src 'self' 'unsafe-eval'; object-src 'self'",


"content_scripts": [{
    "matches": ["http://*/*", "https://*/*"],
    "js": ["js/vendor/require.js", "js/config/loader.js", "js/config/requireInit.js"]
}],
"web_accessible_resources": [
    "js/*", "src/*", "css/*", "img/*"
]}

加载器.js

  require.load = function(context, moduleName, url) {

  var xhr = new XMLHttpRequest(),
      evalResponseText = function(xhr) {
          eval(xhr.responseText);
          context.completeLoad(moduleName);

      };

  xhr.open("GET", url, true);
  xhr.onreadystatechange = function(e) {
      if (xhr.readyState === 4 && xhr.status === 200) {
          evalResponseText.call(window, xhr);
      }
  };
  xhr.send(null);


 };

要求Init.js：

var baseUrl=browser.extension.getURL("/");
requirejs.config({
    config: {
        text: {
            useXhr: function (url, protocol, hostname, port) {
                // allow cross-domain requests
                // remote server allows CORS
                return true;
            }
        }
    },
    skipDataMain: true,
    baseUrl: baseUrl,
    paths: {
        "jquery": "js/vendor/jquery",
        "underscore": "js/vendor/lodash",
        "backbone": "js/vendor/backbone",
        "marionette": "js/vendor/marionette",
        "app": "js/app"
    }
});

console.log("before loading files");//working

require(['jquery', 'app/csApp'], function ($, app) {
    console.log("all js loaded");//not working
});

csApp.js

console.log("inside cs app");//working
    define(function(require) {
      'use strict';
     var $ = require('jquery'),
        _ = require('underscore'),
        Backbone = require('backbone'),
        Marionette = require('marionette'),
        csApp = new Marionette.Application();

       console.log("csApp");//not working
          return csApp;
    });

编辑：console.log()在 jQuery 内部工作。但是，console.log()内部 csApp.js不起作用。

4

1 回答 1

0

我找到了问题的根源。

是洛达什。

我使用的是 lodash.js 而不是 underscore.js。

"underscore": "js/vendor/lodash",

Lodash 与 Firefox 45-46 兼容，我使用的是最新的 Firefox，即 47.0。所以我用下划线替换了 lodash，现在我的网络扩展工作正常。

于 2016-06-21T09:14:49.120 回答