ruby-on-rails - present - rails vendor js

Evite los archivos*.js.erb construyendo todos los valores de asset_path

Question

Así que quiero evitar el procesamiento de archivos JavaScript con ERB solo para poder obtener una ruta de recursos adecuada para, por ejemplo, una imagen.

Actualmente, este parece ser el enfoque popular:

var myImage = "<%= asset_path(''my_image'') %>";

Lo cual, por supuesto, requiere que el nombre del archivo se cambie a "* .erb" para que sea procesado.

Preferiría aislar la fealdad del ERB en un punto de mi proyecto al hacer un solo archivo de manifiesto (por ejemplo, "asset.js.erb") que calcula y pone a disposición todas las rutas de activos que mi JavaScript necesita.

Ciertamente puedo hacerlo HECHO abordándolo caso por caso:

ASSETS =
  "my_image": "<%= asset_path(''my_image'') %>"

window.assetPath = (path) -> ASSETS[path]

Pero, realmente preferiría simplemente escribir un ERB para responder a través de todos mis asset_paths.asset_environment.paths y crear un manifiesto literal de un gran objeto para mí, de modo que mi verdadera aplicación JavaScript pueda llamar con confianza:

var myImage = assetPath(''my_image'');

¿Alguna idea sobre (1) si hay una forma más fácil de hacer esto que no entendí, o (2) cómo realizaría una búsqueda de todos los posibles argumentos válidos para asset_path ?

Answer 1

Antigua pregunta, pero hay una buena manera de lograr esto. Solo para explicar el contexto de mi solución: necesito mostrar marcadores en un mapa, que tienen diferentes iconos posibles basados ​​en las variables dinámicas de JS. Extrañamente, el uso de <% = asset_path (''"+ somefunction (raw_value) +"'')%> no estaba funcionando. Entonces, he buscado la solución abajo.

Concretamente, la solución que estoy utilizando tiene solo un archivo js.erb que almacena los valores de las imágenes y sus nombres de huellas dactilares, que se pueden obtener mediante una función, image_path . Después de eso, todos mis otros archivos JS pueden estar libres de la asset_path de asset_path y, por consiguiente, de la .erb

Cree un archivo images.js.erb en your_application/app/assets/javascripts con el siguiente contenido:

<%
    imgs = {}
    Dir.chdir("#{Rails.root}/app/assets/images/") do
        imgs = Dir["**"].inject({}) {|h,f| h.merge! f => image_path(f)}
    end
%>

window.image_path = function(name) {
    return <%= imgs.to_json %>[name];
};

Solicite este archivo en su application.js , que normalmente está en el mismo directorio que el anterior:

//= require ...
//= require ...
//= require images
//= require_tree .

Luego, dentro del JS que ha estado usando <%= asset_path(''image.png'') %> , usará en su lugar image_path(''image.png'');

Créditos a this publicación de blog por publicar una versión de Coffee script en la que he basado la mía.

Answer 2

Depende del contexto donde se use esta imagen.

Caso de uso 1: La imagen es decorativa y necesita ser cambiada dinámicamente. Ejemplo: Spinner, mientras los datos se están cargando. En este caso, me refiero a que está en mi script sass y java.

.spinner
   background-image: url(image_path("spinner.png"))

Entonces operaría con clases en script java y no con imágenes.

   $.addClass(''spinner'')

Caso de uso 2: La imagen es parte de un objeto.

Hay muchas situaciones, cuando una imagen realmente pertenece a un objeto. En este caso, creo un archivo json, que almacena los datos y la referencia de la imagen de esta manera. Luego uso erb para desenvolver la referencia de imagen - my_object.json.erb:

 {
    "icon" : "<%=image_path("icons/my_icon.png")%>",
    "label":"My label",
    "description":"My description"
 }

El caso de uso 2 requiere más trabajo en el lado de javascript para cargar los archivos json, pero abre opciones de extensibilidad muy poderosas.

La tubería de activos maneja ambos casos de manera famosa.

Answer 3

Una forma más fácil:

1. Obtenga el prefijo de activos en su .js.erb: <% = Rails.configuration.assets.prefix%>. Si se necesita una ruta de acceso absoluta, también puede obtener la URL de la aplicación (es más complicado obtenerla de los rieles, por lo que puede simplemente codificarla en su archivo .js.erb?)

2. Si está trabajando con activos precompilados, obtenga la huella digital de su archivo que se almacena en manifest.yml (en <% = Rails.configuration.assets.manifest%>). El manifiesto contiene una lista con todos sus activos y sus respectivas huellas digitales ( documentation )

3. Haga que assetPath simplemente anteponga el prefijo + URL de la aplicación al nombre de su imagen o huella digital

Un inconveniente es que debe especificar el nombre completo de la imagen (incluida la extensión).