2015-02-11 55 views
0

我已將我的第三方庫從我的應用程序代碼中分離出來,並將它們一起分組到vendor.js文件中以供requirejs使用。在我的build.js文件中,我使用modules語法優化我的主應用程序,排除供應商腳本,並優化vendor.js文件。我遇到的唯一問題是當我編譯的main模塊請求vendor時,它從配置文件中獲取baseUrl,因此不加載優化的vendor.js文件。我build.js文件看起來像這樣:RequireJS baseUrl和多個優化文件

({ 
    baseUrl: "js", 
    dir: "build", 
    mainConfigFile: "js/main.js", 
    removeCombined: true, 
    findNestedDependencies: true, 
    skipDirOptimize: true, 
    inlineText: true, 
    useStrict: true, 
    wrap: true, 
    keepBuildDir: false, 
    optimize: "uglify2", 
    modules: [ 
     { 
      name: "vendor" 
     }, 
     { 
      name: "main", 
      exclude: ["vendor"] 
     } 
    ] 
}) 

而且我main.js文件看起來像這樣:

requirejs.config({ 
    baseUrl: "js", 
    paths: { 
     jquery: 'vendor/jquery/jquery-2.1.3.min', 
     bootstrap: 'vendor/bootstrap/bootstrap.min', 
     handlebars: 'vendor/handlebars/handlebars-v2.0.0', 
     backbone: 'vendor/backbone/backbone-min', 
     underscore: 'vendor/lodash/lodash.underscore', 
     marionette: 'vendor/marionette/backbone.marionette.min', 
     models: 'common/models', 
     collections: 'common/collections' 
    } 
}); 

define(['module', 'vendor'], function(module) { 
    var configPath = "config/config." + module.config().env; 
    require([configPath, 'app', 'jquery'], function(config, Application, $) { 
     $(function() { 
      // Kick off the app 
      Application.start(config); 
     }); 
    }); 
}); 

所有開發在js文件夾中完成的,而我的build.js文件是文件夾之外。優化後的文件最終在build,兄弟姐妹到js,但是當我包括我的主要文件是這樣的:

<script data-main="build/main" src="js/vendor/require/require.max.js"></script> 

它結束了裝載js/vendor.jsdefine()電話。我在這裏錯過了什麼?我如何才能告訴優化的main文件來加載build/vendor.js而不允許尚未加載的優化版本js/vendor.js

回答

1

好吧,我明白了這一點。這很簡單,實際上,只是一個太多配置的情況。當您使用data-main加載腳本時,baseUrl將相對於該文件進行設置。所以,如果我指定js/mainbaseUrl將是js。但是,因爲我在main.js的配置塊中明確指定了baseUrl,所以在開發和生產中都會被覆蓋。通過從main.js中刪除baseUrl: "js",一切都按預期工作。當我將data-main更改爲build/main時,開發版本會加載相對於js的所有內容,並且生產版本會加載相對於build的所有內容(vendor.js)。希望這有助於別人有一天。

requirejs.config({ 
    paths: { 
     jquery: 'vendor/jquery/jquery-2.1.3.min', 
     ... 
    } 
}); 

// 'vendor' is loaded relative to whatever directory main.js is in 
define(['module', 'vendor'], function(module) { 
    ... 
});