包含带有 :cache => 的大型 JS 库真正进入 Rails 应用程序
我正在考虑将 JS 库包含到支持 的 Rails 应用程序中的最佳方法<代码>：缓存=> true JS 和 CSS 选项。
让我举一个例子来描述这个问题：jQueryUI（这只是一个例子）。下载时它通常具有以下结构：
+jq.ui
+css
+skin1
+images
all_the_images.png
jq-ui.css
+skin2
+images
all_the_images.png
jq-ui.css
+js
jquery.js
jq.ui.js
现在为了使用它，我必须将此结构包含到rails应用程序中（2个js文件+ 1-2个css）。 我需要能够使用 :cache => true 选项（这样 jquery、jquery ui、application.js 等都将在一个文件中；jq.ui/skin2/jq-ui.css 和 application.css 也将在一个文件中）。
的问题：cache => true 是单个（组合）CSS 文件不会引用正确的图像，因为它将被移动到 stylesheets 路径而不是 stylesheets/jq.ui.css/skin2 /jq-ui.css。因此，CSS 中的图像链接被破坏。
问题是：
像这样的库应该进入rails应用程序的哪里？我应该重新调整结构到默认的rails约定（并且因此手动修改jquery ui css）修复图像引用）或按原样使用它并以其他方式组合所有文件？
谢谢，
德米特里。
I am thinking about the best way of including a JS library into rails app supporting :cache => true option for both JS and CSS.
Let me take an example to describe the question: jQueryUI (that's just an example). It usually has the following structure when downloaded:
+jq.ui
+css
+skin1
+images
all_the_images.png
jq-ui.css
+skin2
+images
all_the_images.png
jq-ui.css
+js
jquery.js
jq.ui.js
Now in order to use it I have to include this structure into rails app (2 js files + 1-2 css).
I need to be able to use :cache => true option (so that the jquery, jquery ui, application.js etc would be all in one file; also the jq.ui/skin2/jq-ui.css and application.css would be in a single file too).
The problem with :cache => true is that the single (combined) CSS file will not reference the correct images as it will be moved to the stylesheets path instead of stylesheets/jq.ui.css/skin2/jq-ui.css. Thus broken links to images from the CSS.
The question is:
Where the library like this should go in to the rails app? Should I reshuffle the structure to the default rails convention (and thus manually modify jquery ui css to fix image references) or use it as it is and combine all the files some other way?
Thanks,
Dmitriy.
如果你对这篇内容有疑问，欢迎到本站社区发帖提问 参与讨论，获取更多帮助，或者扫码二维码加入 Web 技术交流群。
绑定邮箱获取回复消息
由于您还没有绑定你的真实邮箱，如果其他用户或者作者回复了您的评论，将不能在第一时间通知您！
发布评论
评论（2）
如果我真的想将 jquery ui 皮肤的目录结构保留在一起，我只需将这些 css 文件排除在缓存中，不将其缓存到 1 个文件中。假设您在 jquery ui 之外还有另外 2 个 css 文件：
我只会缓存这些文件并将皮肤与 jquery ui 一起打包，即使它们没有合并到单个文件中。我可能会这样做，因为如果皮肤或皮肤图像更新了，我只想能够插入并替换它来更新它，而不是处理重组目录或修改随之而来的 css/js 文件。它太容易出错，不值得节省 2 个额外的 http 请求。
If I really wanted to keep the directory structure of the jquery ui skins together, I would just exclude those css files from being cached into 1 file. Say you had 2 other css files outside of jquery ui:
I would just cache those and keep skins packaged with jquery ui, even if they don't get combined into a single file. I would probably do this because if a skin or a skin image got updated I would just want to be able to drop in and replace it to update it, rather than deal with restructuring directories or modifying css/js files that came with it. It's too error prone and not worth the benefit of saving 2 extra http requests.
您需要将它们结合起来有什么具体原因吗？我知道这意味着向您的网络服务器发出更多请求，但结果将被缓存。您可能还想考虑使用 google CDN< 提供的 jquery 版本< /a>.
或者，如果您必须将它们合并到一个文件中，那么我建议展平目录结构和/或使用资源的绝对路径。这样做的问题是，您在更新到第三方库的新版本时需要小心，因为这将涉及编辑库。
我个人使用 sprokets 来管理我的 JS 依赖项（而不是
:cache => true），但它也不会帮助您处理这个用例。即便如此，如果您需要大量 javascript，您可能需要考虑看一下。Is there a specific reason why you need to combine them? I understand that it means more requests to your webserver, but the results will be cached. You might also want to consider using a version of jquery that's served off of the google CDN.
Alternatively if you must combine them into one file then I suggest flattening the directory structure and/or using absolute paths to your resources. The problem with this is that you'll need to be careful when updating to new version of your third party libraries as it will involve editing the libraries.
I personally use sprokets for managing my JS dependencies (instead of
:cache => true), but it also won't help you with this use case. Even so, you might want to consider taking a look if you're going to have a lot of javascript.