从Bootstrap文件创建Dojo构建层,最好不要导出整个Dojo库

时间:2014-06-17 05:23:47

标签: javascript optimization dojo amd dojo-build

我有一个简单的Dojo 1.8 AMD网络应用程序。它有几个用于不同MVC视图的引导程序文件和3个自定义模块。我想构建两个引导文件以包含它们的相对依赖关系。

文件结构

- js
    - tournament_organiser
        - Alert
            - templates
                - Alert.html
        - ImportDialog
            - templates
                - ImportDialog.html 
        - SquadronPicker
            - templates
                - SquadronPicker.html           
        - Alert.js // module    
        - config.js // Dojo config file     
        - form_run.js // bootstrap for "from" view
        - list_run.js // bootstrap for "list" list          
        - package.json
        - ImportDialog.js // module
        - SquadronPicker.js // module
        - tournament_organiser.profile.js
    - dojo_toolkit
        - dojo
        - dijit
        - dojox

我想构建2层文件,每个文件对应一个引导程序。每个包含视图中声明性小部件的几个Dijit要求,加上form_run.js使用自定义模块。

到目前为止,我已为package.json提供此内容:

{
    "name": "tournament_organiser",
    "description": "Tournament organiser app for X-Wing Miniatures Game",
    "version": "0.1",
    "dependencies": {
        "dojo": "~1.8.5",
        "dijit": "~1.8.5",
        "dojox": "~1.8.5"
    },
    "main": "src",
    "homepage": "http://xwing-builder.co.uk/tournament",
    "dojoBuild": "tournament_organiser.profile.js"
}

这适用于tournament_organiser.profile.js

var profile = (function(){
    return {
        resourceTags: {
            // tag all.js files as modules
            amd: function(filename, mid) {
                return /\.js$/.test(filename);
            }
        },

        basePath: "./",
        releaseDir: "../tournament_organiser_built",
        action: "release",

        packages:[{
            name: "dojo",
            location: "../dojo_toolkit/dojo"
        },{
            name: "dijit",
            location: "../dojo_toolkit/dijit"
        },{
            name: "dojox",
            location: "../dojo_toolkit/dojox"
        },{
            name: "squad_builder",
            location: "../squad_builder"
        }],

        // this is the bit I'm stuck on... how do I define layers for each bootstrap?
        layers: {
            "form_run": {},
            "list_run": {}
        }

    };
})();

示例引导程序文件(form_run.js):

require( [ 'dojo/parser',

    'dojo/on',
    'dijit/registry',
    'dojo/dom',
    'dojo/dom-style',
    'dojo/_base/array',
    'dojo/_base/lang',
    'dojo/aspect',
    'squad_builder/loadingPane',

    'tournament_organiser/SquadronPicker',
    'tournament_organiser/Alert',

    // used by declarative dijits on page
    'dijit/form/Button',
    'dijit/form/Form',
    'dijit/form/ValidationTextBox',
    'dijit/form/DateTextBox',
    'dijit/form/NumberSpinner',
    'dijit/form/CheckBox',
    'dijit/form/Select',
    'dijit/form/FilteringSelect',

    'dojo/domReady!' ],
    function ( parser, on, registry, dom, domStyle, array, lang, aspect, loadingPane, SquadronPicker, alert )
    {
            ...
    } );

如何告诉构建工具读取我的bootstraps以找到必要的依赖项,并将它们全部捆绑到一个文件中?

此外,是否可以仅输出构建的图层而无需复制所有Dojo Toolkit?在制作中,我使用Google CDN托管的Dojo,因此只需要将我的图层包含在页面中。

事实上,我更愿意将构建的图层放入与源相同的文件夹中,然后加载生产中的图层和开发中的原始文件。这是个坏主意吗?

编辑:

我试过了:

layers: {
    "form_run": { include: [ "tournament_organiser/form_run" ] },
    "list_run": { include: [ "tournament_organiser/list_run" ] }
}

但是收到了很多警告和错误:http://pastebin.com/Yqz5zhT1

0 个答案:

没有答案