打包RequireJS“文字!”模块

时间:2013-10-17 15:48:09

标签: knockout.js requirejs durandal bundling-and-minification r.js

我正在试图弄清楚是否(以及如何可能)使用RequireJS optimization tool不仅包括我的JavaScript模块,还包括我的“文本!”模块。我正在开发一个使用“text!”的Durandal应用程序。视图模块。

有时我们会让用户在尝试加载视图时超时。这是一个示例错误:

Error: Load timeout for modules: text!views/primaryapplicants.html
http://requirejs.org/docs/errors.html#timeout

I've got another question I just posted about handling that timeout。我无法弄清楚如何拦截它并再试一次。我知道模块定义是有效的,只是客户可能有网络连接问题 - 特别是如果他们在手机上。

然而,正如我继续思考这一点,我意识到如果我可以简单地将整个应用程序打包到一个文件中,那么我们就可以避免额外的HTTP调用 - 这可能会减少这样的超时时间。这意味着应用程序要么加载,要么不加载 - 而不是“部分”加载的可能性。

此应用没有大量观看次数。我估计添加每个视图会增加大约20kb的gzip压缩。

那么,是否可以打包这些“文本!”模块以某种方式?

2 个答案:

答案 0 :(得分:1)

inlineText build config option(默认为true),它指示优化器完全按照您的意愿执行操作。需要注意的是,它与任何其他模块一样,只检测某个模块的define()块中指定的依赖关系。换句话说,它将无法检测按需请求的text!依赖项,除非它们明确可以访问 - 这就是您的问题所在。

一种解决方法(如果您有许多视图文件,那么远非理想)将指定您在构建配置中的include option中使用的每个text!依赖项,例如:

// ...
include: ["text!views/primaryapplicants.html",
  "text!views/secondaryapplicants.html",
  // etc.
]
// ...

答案 1 :(得分:1)

你可能想试试weyland,Durandal的优化器。可以在HTML StarterKit中找到weyland-config.js配置示例。

https://github.com/BlueSpire/Durandal/blob/master/platforms/HTML/StarterKit/weyland-config.js

exports.config = function(weyland) {
    weyland.build('main')
        .task.jshint({
            include:'app/**/*.js'
        })
        .task.uglifyjs({
            include:['app/**/*.js', 'lib/durandal/**/*.js']
        })
        .task.rjs({
            include:['app/**/*.{js,html}', 'lib/durandal/**/*.js'],
            loaderPluginExtensionMaps:{
                '.html':'text'
            },
            rjs:{
                name:'../lib/require/almond-custom', //to deploy with require.js, use the build's name here instead
                insertRequire:['main'], //not needed for require
                baseUrl : 'app',
                wrap:true, //not needed for require
                paths : {
                    'text': '../lib/require/text',
                    'durandal':'../lib/durandal/js',
                    'plugins' : '../lib/durandal/js/plugins',
                    'transitions' : '../lib/durandal/js/transitions',
                    'knockout': '../lib/knockout/knockout-2.3.0',
                    'bootstrap': '../lib/bootstrap/js/bootstrap',
                    'jquery': '../lib/jquery/jquery-1.9.1'
                },
                inlineText: true,
                optimize : 'none',
                pragmas: {
                    build: true
                },
                stubModules : ['text'],
                keepBuildDir: true,
                out:'app/main-built.js'
            }
        });
}