W jaki sposób mogę umieścić RequireJS Config w osobnym pliku i uruchomić Optymalizator r.js?

Question

Większość przykładów konfiguracji RequireJS, umieść obiekt konfiguracji w punkcie wejścia main.js, coś jak to:

//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*/}); 

Wolę umieścić obiekt konfiguracji w oddzielnym pliku, bo jak rośnie, trudno zachować w tym samym pliku.

Poniższa konfiguracja działa, gdy uruchomię go w przeglądarce, ale z jakiegoś powodu otrzymuję komunikat o błędzie podczas uruchamiania optymalizator r.js:

//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 
}); 

Kiedy biegnę r.js, pojawia się następujący błąd:

*Tracing dependencies for: main

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

Więc wydaje się, że nie dostanie r.js ustawień konfiguracyjnych, ponieważ szuka app.js jako względny scenariusza, nie jako moduł z określoną ścieżką.

Oto mój plik build.js (Appdir, reż a mainConfigFile są w stosunku do pliku build.js):

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

Answer 1

Oto jak ja to robię. Lubię oddzielanie pliku konfiguracyjnego, ponieważ używam go ponownie w testach.

struktura folderów:

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

Plik konfiguracyjny (require-cfg.js - pokazano tylko istotne rzeczy):

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

plik build (build.js): Kod

({ 
    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> 

wykonam r.js z konfiguracją w folderze build-scriptsbuild.js. Zoptymalizowane i połączone wyjście trafia do folderu build. Możesz dostosować ścieżki do swoich potrzeb.