6

我有一个简单的 requirejs 项目,我正在尝试使用 node.js 优化到一个文件。项目结构是这样的。

|___索引.html
|
├───css
│ style.css
│
└────脚本
    │ main.js
    │
    ├───lib
    │ require.js
    │ underscore.js
    │
    └────模块
            模块1.js
            模块2.js
            模块3.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)相同,这里还有两个想法。

  • 从启动 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 回答