Le pipeline d'actifs de Rails 3.1 et le Javascript ordonné manuellement requièrent

Question

J'essaie de convertir une application existante à la nouvelle disposition du pipeline d'actifs 3.1, et je veux inclure beaucoup de fichiers de fournisseurs qui doivent être dans un ordre spécifique, (underscore.js et backbone étant une paire). En tant que tel, je ne peux pas simplement utiliser un fichier de type = require_tree . pour récupérer mes fichiers fournisseurs (sans renommer chaque fichier avec un préfixe. Beurk).

Ce qui suit fait partie de mon app/assets/javascripts/application.js fichier :

//= require modernizr-1.7
//= require jquery-1.6.1
//= require underscore-1.1.5
//= require backbone-0.3.3
//= require\_tree .

J'ai essayé toutes les combinaisons avec/sans les extensions, avec/sans le require_tree et avec/sans les chemins relatifs, et rien ne fonctionne. Tous mes fichiers fournisseurs sont dans /vendor/assets/javascripts/ .

J'ai l'impression d'être stupide parce que cela semble être un cas d'utilisation tellement évident (inclure des fichiers spécifiques par leur nom dans un ordre est courant en JS, non ?) que je dois faire quelque chose d'idiot ?

Answer 1

Vous avez deux structures possibles : la première et la seconde. Dans les deux exemples suivants, vous exposez un paquet à l'adresse /assets/externals.js . Vous pouvez javascript_include_tag ce paquet, mais vous pouvez aussi l'exiger dans votre application.js archivo.

Le premier

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

Le dossier externals.js contient :

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

Le deuxième

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

Le dossier index.js contient :

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

Answer 2

Vous pouvez exiger chaque fichier dans un ordre particulier et ensuite ajouter :

//= require_self

au lieu de :

//= require_tree .

Answer 3

Ma réponse s'applique à Rails 3.1rc4, je ne sais pas si cela fonctionne de la même manière avec les autres versions.

Vous pouvez en fait placer toutes les instructions require dans app/assets/javascripts/application.js, que les fichiers .js se trouvent ou non dans app/assets/javascripts/ ou vendor/assets/javascripts/.

Comme ça :

// 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

J'ai inclus require_tree ici parce que j'ai d'autres fichiers javascript pour mes contrôleurs individuels (pages.js.coffee, users.js.coffee) et un fichier général pour le site entier (site.js.coffee).

En attendant, voici la structure du fichier.

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

Cela me permet de contrôler l'ordre de chargement des bibliothèques des fournisseurs (ce qui compte beaucoup, en général) et de ne pas me soucier de mon javascript interne, où l'ordre compte généralement moins.

Plus important encore, je contrôle toutes les déclarations require dans un seul fichier souvent utilisé, je trouve cela à la fois plus sûr et plus propre.

Answer 4

Je crois que vous pouvez mettre un library.js dans votre dans vendor/assets/javascripts et ensuite simplement

//= require library.js

de votre application.js Non ?

Answer 5

Require_tree fait exactement ce que vous lui dites. Si vous lui donnez

//= require_tree .

il charge les fichiers dans le répertoire courant où require_tree est appelé. Si vous lui donnez

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

alors vous obtiendrez le javascript sous le vendeur.

Je n'aimais pas la notation ../../ , j'ai donc créé un fichier appelé vendor/assets/javascripts/vendor_application.js qui contient :

//= require_tree .

Cela charge le javascript sous le répertoire du vendeur.

Notez que require recherche les 3 emplacements du pipeline (app, lib, vendor) pour le fichier à require. require_tree est littéral, ce qui est probablement la façon dont il devrait être.

Le railcast sur ce sujet est très utile : http://railscasts.com/episodes/279-understanding-the-asset-pipeline