【发布时间】:2012-12-30 21:44:47
【问题描述】:
我正在尝试使用 RequireJS 优化大量 javascript 文件,但我无法思考如何使用优化器正确构建脚本并以所需的方式将它们加载到浏览器中。
虽然以下描述相当具体,但我想很多其他人也遇到了同样的挑战。 (或者他们在要求上做出了更明智的选择!)
我正在使用bower 下载脚本目录,我想将这些脚本(或其中的一部分)包含在我的网页中。
此外,在测试时,我基本上不想让浏览器检索单独的 Bower 脚本。本地测试框架串行响应请求,所以这很慢。我想使用 RequireJS 优化器或其他方法,将所有下载的 bower 脚本合并到一个文件中。
相比之下,我自己的代码被分解成一长串 Coffeescript 文件,我想使用 RequireJS CS plugin 为浏览器编译它们。
那时开发时,我希望我的浏览器加载如下内容:
components.js-
main.jscsmain.coffeemy_module.coffee
components.js 将由 bower 的 components 目录中的以下文件组成,例如
- jquery: jquery/jquery
- jqueryui:
- jquery-ui/ui/jquery.ui.core
- jquery-ui/ui/jquery.ui.datepicker
- 放大:
- amplify/core/amplify.core
- 放大/请求/amplify.request
- 引导程序:
- bootstrap/js/bootstrap-transition
- bootstrap/js/bootstrap-alert
- bootstrap/js/bootstrap-button
- bootstrap/js/bootstrap-carousel
- bootstrap/js/bootstrap-collapse
- lodash: lodash/lodash
在生产环境中,浏览器会加载一个文件,比如all.js。
所以我的问题是:如果我使用 RequireJS 进入浏览器 main.js 并构建脚本以实现部分和完全优化的构建。我在这个问题上花费了不成比例的时间,而且来自 RequireJS 的莫名其妙和神秘错误的数量非常长——以至于我无法识别出严重的禁止性问题。它似乎不是这项工作的工具,但我很乐意得到纠正。
我所拥有的优化脚本类似于以下内容(以 YAML 表示法):
baseUrl: "../media/my-scripts/"
optimize: none
out: build/all.js
stubModules:
- cs
- coffee-script
paths:
cs: "../../scripts/components/require-cs/cs"
'coffee-script': "../../scripts/components/require-cs/coffee-script"
usf: "./main"
components: "../compiled/components"
name: usf
logLevel: 0
shim: # ...
我想解决的问题似乎很简单,但解决方案还没有出现。 RequireJS,虽然很出色,但比我需要的要复杂得多。 Almond.js 是加载模块的替代方法 - 但问题在于缺乏替代的合适优化器。
如果您有任何想法可以使用r.js 来实现上述目标,或者可能存在哪些合适的替代优化解决方案,我将不胜感激。
【问题讨论】:
标签: javascript requirejs amd bower