在使用require.js构建时使用多个baseUrl

时间:2014-08-12 21:00:53

标签: javascript node.js requirejs r.js

我的项目结构与此类似:

/path/to/project
    /apps
        /app1
            /js
                /modules
                    /bar.js
                    /etc..
                /app1.js
                /app1.build.js
        /foo
            /app2
                /js
                    /modules
                        /cad.js
                        /etc..
                    /app2.js
                    /app2.build.js
    /static
        /js
            /libraries
                /jQuery
                /etc...
            /common-config.js
            /common-build-config.js

common-config.js定义了一组用于加载库的路径,这些路径相对于app1app2都可以使用的项目的Web根目录。 common-build-config.js的目标是为构建过程提供类似的功能。我遇到的问题是我无法在common-build-config.js中使用完全限定路径,因为path/to/project依赖于许多因素(环境,项目分支,服务器等),并且相对路径失败,因为从app1app2common-build-config.js的相对路径不同。 app1app2中的模块加载假定基本目录是app目录,因此我无法在不手动指定吨的路径的情况下更改baseUrl文件中的app[x].build.js参数模块。

有没有办法在baseUrl中指定common-build-config.js,这样就不会影响main.build.js个文件中的路径加载?或者,有没有办法在构建配置中定义路径时使用变量(比如获取Node的__dirName变量的值)?还是有另一种方法可以解决这个问题吗?

示例文件:

[/路径/到/项目/静态/共config.js]

requirejs.config({
    paths: {
        jquery: '/static/js/libraries/jquery/jquery',
        underscore: '/static/js/libraries/underscore/underscore',
        backbone: '/static/js/libraries/backbone/backbone'
    }
});

[/路径/到/项目/应用/ APP1 / JS / app1.js]

require(['/static/js/common-config.js'], function () {
    require([
        // Load common modules
        'jquery',
        'underscore',
        'backbone',
        // Load local modules
        'bar'
    ], function ($, _, backbone, bar) {
        // do stuff
    });
});

[/路径/到/项目/应用/ APP1 / JS / app1.build.js]

({
    name: 'app1',
    out: './app1.min.js',
    optimize: 'uglify',
    mainConfigFile: '../../../../static/js/common-build-config.js',
    findNestedDependencies: true
})

[/路径/到/项目/静态/共集结config.js]

如果我可以做这样的事情而不影响app1.build.js中的路径,那将是很好的:

requirejs.config({
    baseUrl: './',
    paths: {
        jquery: 'libraries/jquery/jquery',
        underscore: 'libraries/underscore/underscore',
        backbone: 'libraries/backbone/backbone'
    }
});

或类似的内容,但没有收到__dirName is not defined之类的错误:

requirejs.config({
    paths: {
        jquery: __dirName + 'libraries/jquery/jquery',
        underscore: __dirName + 'libraries/underscore/underscore',
        backbone: __dirName + 'libraries/backbone/backbone'
    }
});

如果它是相关的,我使用命令从项目根目录构建min文件:

node "static/js/libraries/require/r.js" -o "apps/app1/js/app1.build.js"
node "static/js/libraries/require/r.js" -o "apps/foo/app2/js/app2.build.js"

1 个答案:

答案 0 :(得分:0)

我没有在require.js中找到解决方案,但是我编写了一个nAnt脚本,在运行构建之前在配置脚本上执行字符串替换,这样可以解决问题:

<target name="build.require.common">
    <!-- copy the common build config file to a temp file -->
    <copy file="static/js/common-build-config-template.js" tofile="static/js/common-build-config.js" overwrite="true">
        <filterchain>
            <!-- replace {root} with the project root directory (defined elsewhere) -->
            <replacestring from="{root}" to="${projectRoot}" />
        </filterchain>
    </copy>

    <!-- run node "static/js/r.js" -o "apps/app1/js/app1.build.js" -->
    <exec program="${nodeExe}">
        <arg line="&quot;static/js/r.js&quot; -o &quot;apps/app1/js/app1.build.js&quot;"/>
    </exec>

    <!-- delete the temp config file -->
    <delete file="static/js/common-build-config.js" />
</target>

使用common-build-config-template.js文件,如下所示:

requirejs.config({
    paths: {
        jquery: '{root}/libraries/jquery/jquery',
        underscore: '{root}/libraries/underscore/underscore',
        backbone: '{root}/libraries/backbone/backbone'
    }
});