2016-03-23 13 views
1

jqueryの$のような関数を呼び出して実行できるグローバルなutils変数を持つように、私はbrowserifyでプロジェクトのインポートを整理したいと思っています。同じ変数で複数のインポートを行う方法

だから、最後に私のような何かをしたい:

window.utils = ... 

だから私はutils.aFunction()を使用することができますが、

私も一例として、これは私のプロジェクトになり、いくつかのファイルで私の依存関係を分割したい:libs/math.js

libs 
    |_ math.js //Implements randomInt and RandomFloat methods 
    |_ connection.js //Implements isConnected method 
utils.js //Calls all the required dependencies 

私の考えはこれまでのところ、このような何かを持っていることです。

module.exports = { 
    randInt: function() { 
     return 4; 
    }, 
    randFloat: function() { 
     return 4.1; 
    } 
}; 

そして私はutils.jsにするだろう:

var math = require('./libs/math'); 
var connection = require('./libs/connection'); 

var libs = [math, connection]; 

var utils = {}; 

for (var i = 0; i < libs.length; i++) { 
    for (var key in libs[i]) { 
     utils[key] = libs[i][key]; 
    } 
} 

window.utils = utils; 

これは実際にうまくいきますが、ライブラリでまだ解決されていないかどうかはわかりません。

私はこれを行うより効率的な方法があると感じていますが、browserifyで推奨されるアプローチは何でしょうか?

答えて

0

utilオブジェクトにスローするコードは間違いなく奇妙に見えますが、必要なutilサブモジュール全体でこのループを推奨しません。

var libs = [math, connection]; 

var utils = {}; 

for (var i = 0; i < libs.length; i++) { 
    for (var key in libs[i]) { 
    utils[key] = libs[i][key]; 
    } 
} 

あなたはWebPACKの/ browserifyとJS共通のアプローチを使用していた場合、あなたは、単に設定ファイルにグローバルであるためにあなたのutilを宣言し、単にあなたのutil.js

の内部に必要なmodule.exportsはを追加します
//connect.js 
    module.exports = { 
    isConnected: function(){ 
     return true; 
    } 
}; 
//math.js 
module.exports = { 
    randInt: function() { 
     return 4; 
    }, 
    randFloat: function() { 
     return 4.1; 
    } 
}; 
//utils.js 
exports.math = require('./math'); 
exports.connect = require('./connect'); 
//test.js 
var utils = require('./utils'); 
console.log(utils.math.randInt()); 
console.log(utils.connect.isConnected()); 
関連する問題