Build Durandal with Grunt (R.js + Text)

advertisements

I would like to use Grunt to build a Durandal project, because Weyland remains completely undocumented and isn't as standard as Grunt.

To do this, the grunt task needs to pull in all the js and html files during optimization, but I am unable to get RequireJS to inline the html files via the text module.

It looks like weyland copies the text files manually, but I can't figure out what it's doing to get requirejs (or almond, in this case), to actually use them. I have seeen this question, but it requires the text modules to be referenced in the define call, which isn't done in Durandal.

My gruntfile for require uses this config

requirejs: {
            build: {
                options: {
                    name: '../lib/require/almond-custom', //to deploy with require.js, use the build's name here instead
                    insertRequire: ['main'], //needed for almond, not require
                    baseUrl: 'src/client/app',
                    out: 'build/main-built.js',
                    mainConfigFile: 'src/client/app/main.js', //needed for almond, not require
                    wrap: true, //needed for almond, not require
                    paths: {
                        'text': '../lib/require/text',
                        'durandal':'../lib/durandal/js',
                        'plugins' : '../lib/durandal/js/plugins',
                        'transitions' : '../lib/durandal/js/transitions',
                        'knockout': '../lib/knockout-2.3.0',
                        'bootstrap': '../lib/bootstrap.min',
                        'jquery': '../lib/jquery-1.9.1',
                        'Q' : '../lib/q.min'
                    },
                    inlineText: true,
                    optimize: 'none',
                    stubModules: ['text']
                }
            }
        }


You might want to give https://npmjs.org/package/grunt-durandal a try. I'm using this as part of a grunt based build process. See https://github.com/RainerAtSpirit/HTMLStarterKitPro for an example.

durandal: {
    main: {
        src: ['app/**/*.*', 'lib/durandal/**/*.js'],
            options: {
            name: '../lib/require/almond-custom',
                baseUrl: requireConfig.baseUrl,
                mainPath: 'app/main',
                paths: mixIn({}, requireConfig.paths, { 'almond': '../lib/require/almond-custom.js' }),
                exclude: [],
                optimize: 'none',
                out: 'build/app/main.js'
        }
    }
},