web-dev-qa-db-fra.com

Rails 3.1 pipeline d'actifs et Javascript commandé manuellement nécessite

J'essaie de convertir une application existante vers la nouvelle disposition du pipeline d'actifs 3.1 et je souhaite inclure un grand nombre 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 = require_tree . pour récupérer mes fichiers fournisseurs, (sans renommer chaque fichier avec un préfixe. Beurk).

Ce qui suit est dans mon app/assets/javascripts/application.js fichier:

 // = nécessite modernizr-1.7 
 // = nécessite jquery-1.6.1 
 // = nécessite underscore-1.1.5 
 // = nécessite backbone -0.3.3 
 // = require_tree.

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

J'ai l'impression d'être stupide parce que cela semble être un cas d'utilisation si évident, (y compris des fichiers spécifiques par nom dans un ordre est commun avec JS, non?) Que je dois faire quelque chose d'idiot?

ruby-on-rails-3asset-pipelinesprockets
52
beseku

Vous pouvez exiger chaque fichier dans un ordre particulier, puis ajouter:

//= require_self

au lieu de:

//= require_tree .
29
martinciu

Vous avez deux structures possibles: la première et la seconde. Avec les deux exemples suivants, vous exposez un package à /assets/externals.js. Vous pouvez javascript_include_tag ce package, mais vous pouvez également l'exiger dans votre application.js fichier.

Le premier

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

Le fichier 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 fichier index.js contient:

//= require ./underscore-1.1.6.js
//= require ./modernizr-1.7.js
48
Romain Tribes

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 réellement mettre 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 /

Ainsi:

// 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 les choses à l'échelle du site (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, généralement) et de ne pas me soucier de mon javascript interne, où l'ordre importe généralement moins.

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

8
Olivier Lacan

Je pense que vous pouvez mettre un library.js dans votre dans vendor/assets/javascripts puis simplement

//= require library.js

de ton application.js, non?

6
muxcmux

require_tree fait exactement ce que vous lui dites. Si vous le donnez

//= require_tree .

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

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

alors vous obtiendrez le javascript sous fournisseur.

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 fournisseur.

Remarque, require recherche les 3 emplacements de pipeline (app, lib, vendor) pour le fichier à exiger. require_tree est littéral, ce qui est probablement le cas.

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

4
justingordon