6

ノードを使用して1つのファイルに最適化しようとしている単純なrequirejsプロジェクトがあります。プロジェクトの構造はそうです。

| ___ index.html
|
├───css
│style.css
│
└───スクリプト
    │main.js
    │
    ├───lib
    │require.js
    │underscore.js
    │
    └───モジュール
            module1.js
            module2.js
            module3.js

これが私のビルドファイルです

//build.js
({
    baseUrl: "./SimpleRequireJsProject/scripts",
    name:"main",
    out:"main-built.js"
})

プロジェクトファイルの外部にr.jsとbuild.jsを使用します。ノードコンソールを使用してオプティマイザーを実行しました。

node r.js -o build.js

すべてがうまくいきます。出力main-built.jsが作成されます。しかし、私が交換すると

<script data-main="scripts/main" src="scripts/lib/require.js"></script>

と

<script data-main="scripts/main-built" src="scripts/lib/require.js"></script>

インデックスファイルを実行するとき。エラーはありませんが、出力はありません。私はそのようなコンソールメッセージを期待しています。元のデータで動作します-メインとしてメイン

//出力
メインスタート
m1開始
m2が開始しました..m2からm3を開始します
m3開始

プロジェクトが実行されず、エラーも発生しない理由を見つけるのを手伝ってください。:(

  //main.js
    define([
        'lib/underscore',
        'modules/module1',
        'modules/module2'
    ],
        function (_, Module1, Module2) {
            console.log('main started');
            var module1 = new Module1();
            var module2 = new Module2();
            module1.start();
            module2.start();
        });


    //module1.js
    define(['lib/underscore'],
        function ( _) {
            function Module1() {
                this.start = function () {
                    console.log('m1 started');

                };
            }

            return Module1;
        });

    //module2.js
    define(['lib/underscore', 'modules/module3'],
        function (_, Module3) {
            function Module2() {
                this.start = function () {
                    console.log('m2 started..starting m3 from m2');

                    var module3 = new Module3();
                    module3.start();

                };
            }

            return Module2;
        });

    //module3
    define([
        'underscore'],
        function (_) {
            function Module3() {
                this.start = function () {
                    console.log('m3 started');
                };
            }

            return Module3;
        });


    //index.html

    <!DOCTYPE html>
    <html>
    <head>
        <link href="css/style.css" rel="stylesheet" type="text/css">
        <title></title>
    </head>

    <body>
    <div id="main"></div>
    <script data-main="scripts/main-built" src="scripts/lib/require.js"></script>
    </body>
    </html>
4

3 に答える 3

4

問題が見つかりました。「main-built.js」は「main.js」にするか、main-built でモジュール名を「main」から「main-built」に変更する必要があります。

于 2012-12-04T21:21:48.827 に答える
4

モジュール名 (この場合は portal/main) をファイル名 (portal/main.js) と同じにすることができない場合の別の 2 つのアイデアを次に示します。

  • スタートアップの define() 呼び出しからモジュール名を完全に削除します。これにより、ドキュメントの既定のエントリ ポイントになります。ここでの問題は、どのコマンド ライン引数が使用されているかによって、オプティマイザーが " および ' の使用法について一貫していないことです。

  • ビルドされたファイルの最後の行として require(["startup module name"]) のようなものを追加します。これは、スクリプトが読み込まれるとすぐに実行され、好みの最初のモジュールが呼び出されます。これは、ビルド スクリプトへの自動化が非常に簡単であることが判明し、問題を解決してくれました。

于 2013-02-04T21:24:48.807 に答える
0

Thupten のソリューションから、main-built.js でこの置換を自動化する方法は、コマンド ラインからこれを実行することです。

後

node r.js -o build.js

走る

sed -i -- 's/define("main/define("main-built/g' main/js/Main.min.js
于 2016-02-21T16:45:29.200 に答える