Rails 4 - 如何在供应商文件中引用 javascript 来源

Question

我刚刚发现我需要通过直接在我的应用程序中插入 javascript 文件来修改 Rails 设置的 GMap。

我已经克隆了 infobox 和 markerclusterer 存储库，现在我一直在尝试在我的应用程序中引用相关文件。

我的供应商文件中有克隆附带的文件文件夹。

我知道我需要使用的 javascript 文件是：infobox.js 和 markerclusterer.js

这些文件位于：

 vendor/js-marker-clusterer/src/makerclusterer.js
vendor/v3-utility-library/src/infobox.js

我想用它们代替此视图中的代码：

<script src="//maps.google.com/maps/api/js?v=3.18&sensor=false&client=&key=&libraries=geometry&language=&hl=&region="></script> 
<script src="//google-maps-utility-library-v3.googlecode.com/svn/tags/markerclustererplus/2.0.14/src/markerclusterer_packed.js"></script>
<script src='//google-maps-utility-library-v3.googlecode.com/svn/tags/infobox/1.1.9/src/infobox_packed.js' type='text/javascript'></script> <!-- only if you need custom infoboxes -->

我需要在 app/application.js 中引用 javascript 文件吗？如果是这样，我需要从路径中的什么点开始（假设这些文件不在 vendor/assets/javascripts 文件夹中）？

此外，我知道我需要以某种方式合并 markerclusterer 图像。这些也在克隆的回购中出现并存储在 vendor/js-markerclusterer/images 文件夹中。我如何引用它们以便它们在视图中工作？

Answer 1

使用 cdn 或在您的情况下 googlecode 服务器总是好的，因为文件将从它们的服务器加载得更快。所以是的，这样做不会造成任何伤害。

<script src="//maps.google.com/maps/api/js?v=3.18&sensor=false&client=&key=&libraries=geometry&language=&hl=&region="></script> 
<script src="//google-maps-utility-library-v3.googlecode.com/svn/tags/markerclustererplus/2.0.14/src/markerclusterer_packed.js"></script>
<script src='//google-maps-utility-library-v3.googlecode.com/svn/tags/infobox/1.1.9/src/infobox_packed.js' type='text/javascript'></script> <!-- only if you need custom infoboxes -->

假设您想通过清单文件加载它们（即 application.js），您可以将 markerclusterer.js 和 infobox.js 复制到 app/assets/javascripts 文件夹中并包含他们在 application.js 中是这样的

//application.js file's content
//= markercluster
//= infobox

现在由于这两个文件需要在您的 google 地图 api 文件之后加载，您应该在调用地图 api 之后添加 application.js。这确保 Google 地图 API 首先加载并且 google.maps 对象可供您使用。

<script src="//maps.google.com/maps/api/js?v=3.18&sensor=false&client=&key=&libraries=geometry&language=&hl=&region="></script>
<%= javascript_include_tag 'application', 'data-turbolinks-track' => true %>

此外，您可以将所有图像放在 app/assets/images 内的文件夹中，并像访问其中的任何其他图像一样访问它们。

Answer 2

最合乎逻辑的做法是将文件夹 js-marker-clusterer 和 v3-utility-library 放在 vendor/assets/javascripts 下，这样您就可以在 application.js 中引用您需要的文件，如

//= js-marker-clusterer/src/makerclusterer
//= v3-utility-library/src/infobox

但是，如果由于某种原因您不能这样做，您可以将自定义路径添加到 config.assets.paths 以便自动加载器可以找到它们

// application.rb
config.assets.paths << Rails.root.join("vendor", "js-marker-clusterer")
config.assets.paths << Rails.root.join("vendor", "v3-utility-library")

然后像

一样引用它们

//= src/makerclusterer
//= src/infobox

Rails 4 - 如何在供应商文件中引用 javascript 来源

Rails 4 - how to reference a javascript source in vendor file

javascript

google-maps

ruby-on-rails

path

gmaps4rails