任意の追加の依存関係なしにブラウザでUMDを使用する方法

と仮定私持っている。このようなUMDモジュール（に保存された「JS/mymodule.js」）：私はこのモジュールを使用するにはどうすればよい任意の追加の依存関係なしにブラウザでUMDを使用する方法

(function (global, factory) { 
    typeof exports === 'object' && typeof module !== 'undefined' ?  factory(exports) : 
    typeof define === 'function' && define.amd ? define(['exports'], factory) : 
    (factory((global.mymodule = global.mymodule || {}))); 
}(this, function (exports) { 'use strict'; 
    function myFunction() { 
     console.log('hello world'); 
    } 
}));

このようなHTMLファイルですか？任意の助けを事前に感謝

<!doctype html> 
<html> 
<head> 
    <title>Using MyModule</title> 
    <script src="js/mymodule.js"></script> 
</head> 
<body> 
<script> 
/* HOW TO USE myFunction from mymodule.js ??? */ 
</script> 
</body> 
</html>

（...などrequirejs、commonjs、systemjs、なし）。

出典

2016-07-28 Dorival

-2

amdモジュール形式は非同期に読み込まれるため、スクリプトタグ内のファイルを直接参照することはできません。これが開発に使用されている場合は、requirejsのようなローダーを使用できます（amdの詳細についてはthis linkを参照してください）。後で何をしているのかをプロダクションモードで使用する場合は、いくつかの選択肢があります。

1）requirejsを使用しますが、amdファイルをまとめた最適化プロセスを実行してください。 2）次のような別のミニプロセスを使用してください。あなたのフロントエンドツーリング（grunt、gulpなど）に組み込むことができます。

amd（他のモジュールへの依存関係を宣言する機能）の性質上、ファイルを直接読み込むのは恐ろしいことですが、これは不可能です。

これが役に立ちます。

出典

2016-07-28 13:58:03 paddybasi

あなたはUMDとAMDを混在させるのではないかと心配しています。 –

[OK]をので、あなたはRequireJS、CommonJS、SystemJSない環境で実行されている、など

キーラインが、これはいくつか行いfactory((global.mymodule = global.mymodule || {}))次のとおりです。その後、

global.mymoduleもしtruthyをそれ
0：それ以外の場合は同等です
```
global.mymodule = global.mymodule // A noop. 
factory(global.mymodule) 
```

に相当します工場インサイド

global.mymodule = {} 
factory(global.mymodule)

：あなたの工場は、あなたがexportsに割り当てることで、あなたのモジュールからエクスポートするものをエクスポートする必要があります。したがってexports.myFunction = myFunctionを実行してmyFunctionをエクスポートします。

工場外：エクスポートされた値は、グローバル空間にエクスポートされたmymoduleになります。たとえば、myFunctionを使用する場合は、mymodule.myFunction(...)を使用します。

それがはっきりしない場合。コード内のファクトリは、で始まるファンクションです。ここには、myFunctionが正しく入力されています。

出典

2016-07-28 16:37:34 Louis

これは最高の答えであり、そうでなければ埋もれて隠されている多くの情報を提供します。誰もあなたがRequireJS、SystemJS、Webpackなどを使用することを期待しているようです。 –

ロールアップで作成されたバンドルUMDファイルを使用しようとしているときにこのページに来ました。素晴らしい質問と素晴らしい答え... –

簡単な答え：通常のUMDを使用している場合は、window.mymodule（またはlibの名前が何であれ）で利用できるはずです。

出典

2016-11-25 10:36:57

任意の追加の依存関係なしにブラウザでUMDを使用する方法

答えて

関連する問題