web-dev-qa-db-ja.com

Browserifyのグローバル変数の定義

私はSpineJS（commonjsモジュールをエクスポートする）を使用しており、どこでも使用するため、グローバルに使用できる必要がありますが、Spineを使用するすべてのファイルでSpine = require('spine')を実行する必要があるようです。

Spineを一度定義してグローバルに利用可能にする方法はありますか？

PS：私は例としてSpineを使用していますが、他のライブラリでこれを行う方法については一般的に疑問に思っています。

browserifyspine.js
32
sebastiannm

各ファイルにSpine = require('spine')を記述するのが正しい方法です。

ただし、globalまたはwindowオブジェクトを使用することにより、いくつかの可能性があります（browserifyはglobalオブジェクトをグローバル名前空間であるwindowに設定します）。

  • spine.js内：_global.Spine = module.exports_
  • browserifyにバンドルされている他の.jsファイル：global.Spine = require('spine')
  • spine.jsファイルの後の.htmlファイルによって参照されるスクリプトタグまたは.jsファイル内：window.Spine = require('spine')
56
David Bonnet

まず第一に、あなたの例ではデビッドは正しいです。必要なすべてのモジュールにすべての依存関係を含めてください。非常に冗長ですが、あらゆる種類のアンチパターンと潜在的な将来の問題を軽減するコンパイル時の魔法はありません。

本当の答え。

これは常に実用的ではありません。 Browserifyは、insertGlobalVarsというオプションを受け入れます。ビルド時に、提供されたキー名に一致する識別子について各ストリーミングファイルがスキャンされ、モジュール内で割り当てられていない各識別子を解決する引数を含むIIFEでモジュールをラップします。これはすべて、依存関係ツリーが完成する前に行われるため、requireを使用して依存関係を解決できます。

TLDR

BrowserifyでinsertGlobalVarsオプションを使用します。

_browserify({
  insertGlobalVars: {
    spine: function(file, dir) {
      return 'require("spine")';
    }
  }
});
_

スキャンされたすべてのファイルについて、割り当てられていない識別子spineが存在する場合、require("spine")として解決します。

16
Han Yolo