La canalización de activos de Rails 3.1 y el pedido manual de Javascript requieren

Estoy tratando de convertir una aplicación existente al nuevo diseño de canal de activos 3.1, y quiero incluir muchos archivos de proveedores que tienen que estar en un orden específico, (underscore.js y backbone son un par). Como tal, no puedo usar a = require_tree . para extraer los archivos de mi proveedor (sin renombrar cada archivo con un prefijo. Yuck).

Lo siguiente está dentro de mi archivo app/assets/javascripts/application.js :

 // = requiere modernizr-1.7
 // = requiere jquery-1.6.1
 // = requiere subrayado-1.1.5
 // = require backbone-0.3.3
 // = require_tree.

He probado todas las combinaciones de extensiones con / sin, con / out el árbol de requisitos y con / fuera de las rutas relativas, y nada funciona. Todos los archivos de mi proveedor están en /vendor/assets/javascripts/ .

Siento que estoy siendo estúpido porque parece un caso de uso tan obvio (incluir archivos específicos por nombre en un pedido es común con JS, ¿no?) Que debo estar haciendo algo estúpido.

Puede solicitar cada archivo en un orden particular y luego agregar:

 //= require_self 

en lugar de:

 //= require_tree . 

Tienes dos estructuras posibles: la primera y la segunda. Con los dos ejemplos siguientes, expone un paquete en /assets/externals.js . Puede javascript_include_tag este paquete, pero también puede requerirlo en su archivo application.js .

El primero

 vendor/ ├── assets │ ├── javascripts │ │ ├── externals.js │ │ ├── modernizr-1.7.js │ │ └── underscore-1.1.6.js │ └── stylesheets └── plugins 

El archivo externals.js contiene:

 //= require ./underscore-1.1.6.js //= require ./modernizr-1.7.js 

El segundo

 vendor/ ├── assets │ ├── javascripts │ │ └── externals │ │ ├── index.js │ │ ├── modernizr-1.7.js │ │ └── underscore-1.1.6.js │ └── stylesheets └── plugins 

El archivo index.js contiene:

 //= require ./underscore-1.1.6.js //= require ./modernizr-1.7.js 

Mi respuesta se aplica a Rails 3.1rc4, no sé si funciona igual con otras versiones.

En realidad, puede poner todas las instrucciones requeridas en la aplicación / assets / javascripts / application.js, independientemente de si los archivos .js están en la aplicación / assets / javascripts / or vendor / assets / javascripts /

Al igual que:

 // this is in app/assets/javascripts/application.js //= require modernizr-2.0 //= require jquery //= require jquery_ujs //= require jqueryui-1.8.12 //= require jquery.easing-1.3 //= require jquery.noisy //= require jquery.jslide-1.0 //= require respond //= require smoke //= require_tree 

Incluí require_tree aquí porque tengo otros archivos javascript para mis controladores individuales (pages.js.coffee, users.js.coffee) y uno general para todo el sitio (site.js.coffee)

Mientras tanto, aquí está la estructura de archivos.

 app/ ├── assets │ ├── javascripts │ │ ├── application.js │ │ ├── pages.js.coffee │ │ ├── users.js.coffee │ │ └── site.js.coffee │ └── stylesheets └── plugins vendor/ ├── assets │ ├── javascripts │ │ ├── jquery.easing-1.3.js │ │ ├── jquery.jslide-1.0.js │ │ ├── jquery.noisy.js │ │ ├── jqueryui-1.8.12.js │ │ ├── modernizr-2.0.js │ │ ├── respond.js │ │ └── smoke.js │ └── stylesheets └── plugins 

Esto me permite controlar el orden de carga de las bibliotecas de proveedores (lo cual es muy importante, por lo general) y no preocuparme por mi javascript interno, donde el orden generalmente importa menos.

Más importante aún, yo controlo todas las declaraciones requeridas dentro de un archivo de uso frecuente, considero que ambas son más seguras y más limpias.

Creo que puedes poner una library.js en tu vendor/assets/javascripts y luego simplemente

 //= require library.js 

desde su application.js , no?

require_tree hace exactamente lo que le dices. Si lo das

 //= require_tree . 

carga los archivos en el directorio actual donde require_tree es llamado. Si lo das

 //=require_tree ../../../vendor/assets/javascripts 

entonces obtendrás el javascript en el proveedor.

No me gustó la notación ../../ .., así que creé un archivo llamado vendor / assets / javascripts / vendor_application.js que contiene:

 //= require_tree . 

Eso carga el javascript bajo el directorio del proveedor.

Tenga en cuenta que require busca las 3 ubicaciones de canalización (aplicación, lib, proveedor) para que el archivo lo requiera. require_tree es literal, que probablemente sea la forma en que debería ser.

La transmisión de los raíles es muy útil: http://railscasts.com/episodes/279-understanding-the-asset-pipeline