9

Chrome拡張機能でRequre.jsを使用しようとしています。

これが私のマニフェストです：

{
    "name":"my extension",
    "version":"1.0",
    "manifest_version":2,
    "permissions": ["http://localhost/*"],
    "web_accessible_resources": [
        "js/test.js"
    ],
    "content_scripts":[
        {           
            "matches":["http://localhost/*"],
            "js":[
                "js/require.js",
                "js/hd_init.js"
            ]
        }
    ]
}

hd_init.js

console.log("hello, i'm init");

require.config({
    baseUrl: chrome.extension.getURL("js")
});

require( [ "js/test"], function ( ) {
    console.log("done loading");
});

js / test.js

console.log("hello, i'm test");
define({"test_val":"test"});

これは私がコンソールで取得するものです：

hello, i'm init chrome-extension://bacjipelllbpjnplcihblbcbbeahedpo/js/hd_init.js:8
hello, i'm test test.js:8
**Uncaught ReferenceError: define is not defined test.js:2**
done loading

そのため、ファイルはロードされますが、「define」関数は表示されません。これは、ある種のスコープエラーのように見えます。ローカルサーバーで実行すると、正常に動作します。

何か案は？

4

2 に答える 2

7

コンテンツ スクリプトには 2 つのコンテキストがあります。1 つはブラウザ用で、もう 1 つは拡張用です。

拡張コンテキストに require.js をロードします。しかし、require.js は依存関係をブラウザー コンテキストに読み込みます。defineブラウザで定義されていません。

この問題について (テストされていない) パッチを書きました。これを使用するには、require.js の後にこれを拡張コンテキストにロードします。モジュールは拡張コンテキストにロードされます。お役に立てれば。

require.attach = function (url, context, moduleName, onScriptLoad, type, fetchOnlyFunction) {
  var xhr;
  onScriptLoad = onScriptLoad || function () {
    context.completeLoad(moduleName);
  };
  xhr = new XMLHttpRequest();
  xhr.open("GET", url, true);
  xhr.onreadystatechange = function (e) {
    if (xhr.readyState === 4 && xhr.status === 200) {
      eval(xhr.responseText);
      onScriptLoad();
    }
  };
  xhr.send(null);
};
于 2012-05-27T07:17:54.053 に答える
0

現在推奨されているアプローチは、cajon（https://github.com/requirejs/cajon/）を使用することです。https://groups.google.com/d/msg/requirejs/elU_NYjunRw/3NT9NIFL2GUJを参照してください。

于 2012-08-28T07:06:16.917 に答える