Tôi có thể đặt cấu hình RequireJS trong tệp riêng biệt như thế nào và làm cho Trình tối ưu hóa r.js hoạt động?

Question

Hầu hết các ví dụ về thiết lập RequireJS, đặt các đối tượng cấu hình trong điểm main.js nhập cảnh, một cái gì đó như thế này:

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

tôi thích để đặt các đối tượng cấu hình trong một file riêng biệt, bởi vì như nó phát triển, đó là khó khăn để duy trì trong cùng một tệp.

Các thiết lập sau đây hoạt động khi tôi chạy nó trong trình duyệt, nhưng đối với một số lý do tôi nhận được một lỗi khi chạy r.js ưu:

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

Khi tôi chạy r.js, tôi nhận được sau lỗi:

*Tracing dependencies for: main

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

vì vậy, có vẻ như r.js không nhận các thiết lập cấu hình, bởi vì nó đang tìm kiếm app.js như một kịch bản tương đối, không phải là một mô-đun với một con đường được xác định.

Đây là tập tin build.js tôi (appDir, dir và mainConfigFile có liên quan đến các tập tin build.js):

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

Answer 1

Đây là cách tôi làm việc đó. Tôi thích có tập tin cấu hình riêng biệt bởi vì tôi đang tái sử dụng nó trong các bài kiểm tra.

cấu trúc thư mục:

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

Các tập tin cấu hình (require-cfg.js - chỉ hiển thị những thứ liên quan):

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

Việc xây dựng tập tin (build.js): Mã

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

Tôi thực hiện r.js với cấu hình build.js bên trong thư mục build-scripts. Tối ưu hóa và kết hợp đầu ra đi đến thư mục build. Bạn có thể điều chỉnh đường dẫn cho phù hợp với nhu cầu của mình.