Come posso inserire RequireJS Config in file separati e far funzionare l'ottimizzatore r.js?

Question

maggior parte degli esempi per la configurazione RequireJS, posizionare l'oggetto di configurazione nel punto di ingresso main.js, qualcosa di simile:

//main.js 
require.config({ 
"paths": { 
    //libs 
    "lib1": "assets/js/lib/lib1", 
    "lib2": "assets/js/lib/lib2", 
    "lib3": "assets/js/lib/lib3", 
    "lib4": "assets/js/lib/lib4" 
    } 
}); 
//start the app 
define(["lib1"], function(lib1){/*start the app*/}); 

preferisco mettere l'oggetto di configurazione in un file separato, perché man mano che cresce, è difficile mantenere nello stesso file.

La configurazione che segue funziona quando l'eseguo nel browser, ma per qualche ragione ho un errore quando si esegue il r.js ottimizzatore:

//config.js 
define({/*all configuration here*/}); 

//main.js 
define(["config", "require"], function(config, require){ 
    requirejs.config(config); //set configuration 
    require(["app"]); //launch app, where "app" path is defined in config.js 
}); 

Quando eseguo r.js, ricevo il seguente errore:

*Tracing dependencies for: main

Error: ENOENT, no such file or directory 'C:\Work\project\target\app.js*

Così sembra che r.js non ottiene le impostazioni di configurazione, perché è alla ricerca di app.js come uno script relativo, non come un modulo con un percorso definito.

Ecco il mio file build.js (AppDir, dir e mainConfigFile sono relative al file build.js):

({ 
    appDir: "../src", 
    baseUrl: ".", 
    dir: "../target", 
    mainConfigFile: "../src/main.js", 
    findNestedDependencies: true, 
    modules: [ 
     { 
      name: "main" 
     } 
    ] 
}) 

Answer 1

Questo è come lo faccio. Mi piace avere il file di configurazione separato perché lo sto riutilizzando nei test.

struttura di cartelle:

PROJECT 
| 
+- build (build output directory) 
| 
+- build-scripts (contains r.js, build.js) 
| 
+- WebContent 
    | 
    +- index.html (application main file) 
    | 
    +- scripts 
     | 
     +- require-cfg.js 
     | 
     +- main.js 
     | 
     +- ... 

Il file di configurazione (require-cfg.js - mostrando solo la roba rilevante):

var require = { 
    baseUrl: "scripts", 
    paths: ... 
    ... 
}; 

Il file build (build.js): Codice

({ 
    appDir: "../WebContent/", 
    baseUrl: "scripts/", 
    mainConfigFile: "../WebContent/scripts/require-cfg.js", 
    paths: { 
     /* repeated from require-cfg.js */ 
    }, 
    dir: "../build", 
    optimize: "uglify2", 
    inlineText: true, 
    removeCombined: true, 

    name: "main" 
}) 

Bootstraping (index.html):

<script src="scripts/require-cfg.js"></script> 
<script src="scripts/lib/require-2.0.2-jquery-1.10.2.js"></script> 
<script src="scripts/main.js"></script> 

eseguo r.js con la configurazione build.js all'interno della cartella build-scripts. L'output ottimizzato e combinato va alla cartella build. È possibile adattare i percorsi in base alle proprie esigenze.