2012-12-04 14 views
6

Ho un semplice progetto requirejs che sto cercando di ottimizzare su un file utilizzando il nodo. La struttura del progetto è così.RequireJs Optimizer si limita a un file ma non avvia lo strumento principale

 

|___index.html 
| 
├───css 
│  style.css 
│ 
└───scripts 
    │ main.js 
    │ 
    ├───lib 
    │  require.js 
    │  underscore.js 
    │ 
    └───modules 
      module1.js 
      module2.js 
      module3.js 

Ecco il mio file di generazione

//build.js 
({ 
    baseUrl: "./SimpleRequireJsProject/scripts", 
    name:"main", 
    out:"main-built.js" 
}) 

Con r.js e build.js al di fuori del file di progetto. Ho eseguito l'ottimizzatore utilizzando la console dei nodi.

node r.js -o build.js 

Tutto funziona bene. l'output main-built.js viene creato. Ma Se si sostituisce la

<script data-main="scripts/main" src="scripts/lib/require.js"></script> 

con

<script data-main="scripts/main-built" src="scripts/lib/require.js"></script> 

quando si esegue il file di indice. Non c'è errore ma non c'è uscita. Mi aspetto i messaggi della console in questo modo. che lavora con i dati-main originale come principale

 
//output 
main started 
m1 started 
m2 started..starting m3 from m2 
m3 started 

Si prega di aiutarmi a scoprire il motivo per cui il progetto non viene eseguito e non ci sono errori pure. :(

//main.js 
    define([ 
     'lib/underscore', 
     'modules/module1', 
     'modules/module2' 
    ], 
     function (_, Module1, Module2) { 
      console.log('main started'); 
      var module1 = new Module1(); 
      var module2 = new Module2(); 
      module1.start(); 
      module2.start(); 
     }); 


    //module1.js 
    define(['lib/underscore'], 
     function (_) { 
      function Module1() { 
       this.start = function() { 
        console.log('m1 started'); 

       }; 
      } 

      return Module1; 
     }); 

    //module2.js 
    define(['lib/underscore', 'modules/module3'], 
     function (_, Module3) { 
      function Module2() { 
       this.start = function() { 
        console.log('m2 started..starting m3 from m2'); 

        var module3 = new Module3(); 
        module3.start(); 

       }; 
      } 

      return Module2; 
     }); 

    //module3 
    define([ 
     'underscore'], 
     function (_) { 
      function Module3() { 
       this.start = function() { 
        console.log('m3 started'); 
       }; 
      } 

      return Module3; 
     }); 


    //index.html 

    <!DOCTYPE html> 
    <html> 
    <head> 
     <link href="css/style.css" rel="stylesheet" type="text/css"> 
     <title></title> 
    </head> 

    <body> 
    <div id="main"></div> 
    <script data-main="scripts/main-built" src="scripts/lib/require.js"></script> 
    </body> 
    </html> 

risposta

4

ho trovato il mio problema. Il 'main-built.js' deve essere 'main.js' o nel main-costruito il nome del modulo deve essere cambiato da 'main' a ' main-costruito'.

+0

corretta, ho solo detto di avere lo stesso problema. Ma questo è un problema, perché se aggiungi il fingerprinting (cache busting) al nome del file non verrà caricato! –

4

Ecco altri due idee, se non si può fare il nome del modulo (nel nostro caso si tratta di portale/principale) lo stesso del nome del file (che è il portale/main.js).

  • Rimuovere completamente il nome del modulo dalla chiamata di definizione define(). Questo lo rende il punto di ingresso predefinito f o il documento. Il problema qui è che l'ottimizzatore non è coerente con l'uso di "e" a seconda degli argomenti della riga di comando.

  • Aggiungere qualcosa come require (["nome del modulo di avvio"]) come ultima riga del file di costruito. Questo eseguirà immediatamente quando lo script viene caricato e mettere in primo modulo di vostro gradimento. Questa si è rivelata veramente facile per automatizzare in script di build e ha risolto il problema per noi.

+0

Andremo con la tua seconda opzione. Dato che il modulo ha smesso di funzionare non appena abbiamo aggiunto uno SHA al nome del file generato (come busting della cache). I moduli AMD sono fantastici, ma Require.JS è un vero inferno! –

0

da La soluzione di Thupten, un modo per automatizzare questa sostituzione in main-built.js è di eseguirlo dalla riga di comando:

Dopo

node r.js -o build.js 

corsa

sed -i -- 's/define("main/define("main-built/g' main/js/Main.min.js