如何在 Play 框架中使用 RequireJS 优化器？

Question

如广告所示，Play 中的 rjs 可以

ensure that any JavaScript resources referenced from within a WebJar are automatically referenced from the jsdelivr CDN. In addition if any .min.js file is found then that will be used in place of .js. An added bonus here is that there is no change required to your html!

但是，我似乎无法使其中任何一个起作用。

我在生产模式下尝试运行我的 Play 应用程序，我的所有 webjar javascript 仍然被引用为本地。
我没有看到 .min 版本的 javascript 文件正在生产中使用。
我无法让依赖注入在生产模式下工作。例如，当我想像这样在我的代码中注入 jquery 时

定义(['jquery'],函数($){ 'use strict'; console.log($.grep); return{ 总和：函数（a，b）{ return a + b; } }; });

我可以让它在开发模式下正常工作，但在生产模式下，rjs 失败说

[info] Error: ENOENT, no such file or directory '/Users/khanguyen/Desktop/rjsdemo/target/web/rjs/build/js/jquery.js'
[info] In module tree:
[info]     main
[info]       app
[info] 
[info] Error: Error: ENOENT, no such file or directory '/Users/khanguyen/Desktop/rjsdemo/target/web/rjs/build/js/jquery.js'
[info] In module tree:
[info]     main
[info]       app
[info] 
[info]     at Error (native)

尽管 Webjar

生成了配置设置，但显然它正在寻找 jQuery 的错误位置

requirejs.config({"paths":{"jquery":["/webjars/jquery/1.11.1/jquery","jquery"]},"shim":{"jquery":{"exports":"$"}},"packages":[]})    }

获得 jquery 的正确位置。

我正在使用 Play 2.4.0，在我的 build.sbt 中设置了 pipelineStages := Seq(rjs, digest)。

请告诉我哪里做错了。

谢谢！

Answer 1

事实证明，RequireJS 优化支持并不适用于所有 Webjars，而是仅限于 Classic Webjars。

即便如此，一个 webjar 构建文件也必须包含在常规模块中才能使 rjs 工作。

例如，如果您查看 jQuery 经典 webjar，您会看到包含一个特殊的 webjar 构建指令。查看该文件以获取信息。

一旦你确定了一个支持 RequireJS 的 webjar，你就可以让 sbt-rjs 来做这件事。这是我的设置供参考：

/** javascripts/main.js **/
'use strict';

requirejs.config({
    paths:{
        'jquery': ['../lib/jquery/jquery'],
        'react': ['../lib/react/react'],
        'bootstrap': ['../lib/bootstrap/js/bootstrap'],
        'react-bootstrap': ['../lib/react-bootstrap/react-bootstrap']
    },
    shim: {
        'bootstrap': {
            deps: ['jquery']
        },
        'react-bootstrap': {
            deps: ['react']
        }
    }
});

记得要有方括号，否则CDN替换不会发生

对于非 requirejs 就绪脚本，在声明 paths 时不应使用方括号。否则，rjs 将拒绝构建并出现错误 path fallback not supported。当然，您不会获得 CDN 的好处。请注意，RequireJS css 优化也有效。但仅限于内联 css，就像常规 Requirejs 所做的那样。

如何在 Play 框架中使用 RequireJS 优化器？

How to use RequireJS optimizer in Play framework?

requirejs

webjars

requirejs-optimizer

playframework-2.4