Require.js en una app rails.

4 views
Skip to first unread message

Nicolas Zuasti

unread,
May 16, 2012, 10:16:26 AM5/16/12
to p-s-f
Require.js en un proyecto rails.

  • Creamos un nuevo proyecto rails: rails new require-example
  • Bajamos Require.js (versión jquery) desde:  http://requirejs.org/docs/download.html#samplejquery
  • Editamos la vista layouts/application.html.erb y le sacamos el vinculo a application.js (ya que vamos usar require para este fin)
  • En lugar de application.js ponemos <script data-main="assets/main" src="assets/require-jquery.js"></script> (notar el uso del directorio assets directamente sin usar assets/javascripts, beneficio de usar los sprockets de rails.
  • Creamos un archivo main.js (donde vamos a listar las librerias de forma "organizada) como sigue:
    • require(["jquery"], function($) {
    •     $(function() {
    •         alert("todo listo");
    •     });
    • });

Todo llisto para usar.

Saludos

PD: saquenle el alert... era solo para mostrar un punto.

A.P. Nicolás Zuasti
@zonical.net/cv

Jesús Guibert

unread,
May 16, 2012, 10:29:31 AM5/16/12
to p-...@googlegroups.com
:) Esta muyyyy bueno el require, ver en la consolita del Chrome como te va cargando dinamicamente las librerias que valla consumiendo no tiene palabras :).
Hay veces que se marea con las dependencias, dejo a continuacion como como lo mapee para poder usarlo con Backbone-Forms... y como queda reeee prolijo cuando lo maquetamos en carpetas

require.config({
    paths:{
      text: 'libs/require/text',
      templates: '../templates',
      backboneforms: 'libs/backbone/backbone-forms',
    },
});

require([
    'libs/jquery/jquery-min',
    'libs/underscore/underscore-min',
    'libs/backbone/backbone-min',
    'app'
], function($,_,Backbone,App) {
        App.initialize();
});




Saludos

Jesús Guibert

unread,
May 16, 2012, 10:31:47 AM5/16/12
to p-...@googlegroups.com
El 16/05/2012 11:16, Nicolas Zuasti escribió:
me olvidaba del siguiente link que explica clarito lo anterior
link: http://backbonetutorials.com/organizing-backbone-using-modules/

Saludos


Nicolas Zuasti

unread,
May 16, 2012, 10:36:29 AM5/16/12
to p-...@googlegroups.com
Para los que no estan empapados en require (yo recien arranco a tocarlo "enserio").

Lo que hace lo siguiente:

require([
    'libs/jquery/jquery-min',
    'libs/underscore/underscore-min',
    'libs/backbone/backbone-min',
    'app'
], function($,_,Backbone,App) {
        App.initialize();
}); 

Es cargar una serie de librerias (dentro de un arreglo de strings) y las pasa como dependencias de la función declarada despues de dicho arreglo. De esta forma garantiza que las dependencias de dicha función sean ejecutadas en su correcto orden, antes de ejecutar la función propiamente dicha.

Espero haberme explicado bien? Es así no Jesus?

A.P. Nicolás Zuasti
@zonical.net/cv


2012/5/16 Jesús Guibert <njgu...@gmail.com>

sebastian

unread,
May 16, 2012, 11:05:56 AM5/16/12
to p-...@googlegroups.com
Sí ese es un excelente tutorial, además propone una solución para cargar asincronamente versiones de librerias que no tengan soporte para AMD.

Por ejemplo underscore, jquery y jquery ui tienen sus versiones para carga asíncrona a la vuelta, aunque si se nos antoja utilizar la más nueva de las versiones, la solución del tutorial que mandó Jesús es una buena opción.

Jesús Guibert

unread,
May 16, 2012, 11:47:34 AM5/16/12
to p-...@googlegroups.com
CORRECTO diria Susana GImenez :P

Nicolas Zuasti

unread,
May 16, 2012, 12:03:58 PM5/16/12
to p-...@googlegroups.com
Hice la mini guia (super bajo nivel) porque a mi cada vez se me complica más agregar código JS sin tener que estar pensando en donde meterlo y en que orden. El manejo de los Assets de Rails esta "bueno" pero me ha terminado complicando mas de lo que me ayuda.

Require.js en principio me va a ayudar a resolver el problema "desorden" que no es menor (despues de las 100 vistas de rails - 100 archivos js, arrancas a sentirte como cansado de solo tratar de hacer un mapa mental de dependencias).

Salu2

Sebastián Daloia Servetti

unread,
Jun 28, 2012, 7:02:31 AM6/28/12
to p-...@googlegroups.com
Estuve actualizando un proyectito con la nueva versión del require,

RequireJS 2.0

la cual arregla un montón de problemas, que debian ser anteriormente resueltos con los plugincirigilios,

el gran dolor de cabeza que  daba la versión primera era la carga de librerias no modulares, y sin soporte AMD, con lo cual intentar agregar Backbone, jQuery, socket.io, y backbone.io se podía convertir en un gran dolor de cabeza, trastocando las ideas diafanas, en aguas de pozo negro

Ahora con el elemento de configuracion shim, el problema es abarcado, sin la necesidad de andar modificando librerias, o buscando plugins.

El enlace de la API, explica muy bien este problema, y la solución.



Alvaro Correa

unread,
Jun 30, 2012, 3:55:57 PM6/30/12
to p-...@googlegroups.com
Yo justamente estaba por echarle el ojo a la versi�n 2.0.

La verdad nunca entend� bien cual es concretamente el problema con
librer�as no-AMD y requireJS.

Hasta ahora he podido usar sin problemas ambos tipos de librerias sin
mayores problemas. Tambi�n encontr� versiones AMD de algunas librer�as
(como backbone) pero no le veo ning�n cambio significativo.

Sebastián Daloia Servetti

unread,
Jun 30, 2012, 7:29:49 PM6/30/12
to p-...@googlegroups.com
Tenemos experiencias diferentes con la primera versión del Require Alvarito,
para mi fue un problema declarar las librerias no modulares que tenian dependencia de otras léase: Backbone, la url de backbone.io, o jQueryUI.

Lo que me pasaba es que al no ser modulares, es decir no estar definidos los archivos por el define() del require, los muchachos no le hacían caso a la autoridad del order.js y se cargaban antes que sus dependencias; la página que pasó Jesús(backbonetutorials) presentaba una formula para soslayar este problema, pero no me funcionó.

El enlace que pasé resume el porqué de la incorporación del shim, en la configuración del require. La verdad que esa solución fue recibida por mi ser con la misma alegria con la que gritaria un gol Frachia para Los Sauces!

El 30 de junio de 2012 16:55, Alvaro Correa <correapereira...@gmail.com> escribió:
Yo justamente estaba por echarle el ojo a la versión 2.0.

La verdad nunca entendí bien cual es concretamente el problema con librerías no-AMD y requireJS.

Hasta ahora he podido usar sin problemas ambos tipos de librerias sin mayores problemas. También encontré versiones AMD de algunas librerías (como backbone) pero no le veo ningún cambio significativo.

Alvaro Correa

unread,
Jul 4, 2012, 1:08:58 AM7/4/12
to p-...@googlegroups.com
A mi me pasaba mucho eso antes de usar el order.js, despu�s de empezar a
usarlo no me pas� m�s, pero se cargaban bien las no modulares.
Claro, nunca prob� con otra cosa que no fuese backbone, tipo plugins de
jQuery o cosas as�.

De todos modos, me gusta el tema del shim, me gusta el manejo de errores
(estaba haciendo unas brutas chanchadas para buscarle la vuelta a eso),
en fin, me gusta la versi�n 2.0, ya me estoy poniendo a hacer los
upgrades correspondientes.

Uno de los proyectos que estaba trabajando con require justamente es
interactive, que est� trabajando casi bien, pero el tema del servidor
est� poniendo a prueba las de oro.

Es incre�ble, la primera vez anda perfecto, pero le das F5 y se va todo
por el ca�o.

Reply all
Reply to author
Forward
0 new messages