如何打包加載了RequireJS的外部庫？

我已經用requireJS設置了一個Angular應用程序。在部署之前，我將所有內容捆綁成一個獨特的文件。通常，外部庫沒有requireJS'define'包裝器。如何打包加載了RequireJS的外部庫？

例如，角度視差庫是這樣寫的：

# https://github.com/durated/angular-parallax/blob/master/angular-parallax.min.js 
angular.module("duParallax",["duScroll","duParallax.directive"...

這是我main.js：

require.config({ 
    baseUrl: '/angular-dev', 
    paths: { 
    angular: '//ajax.googleapis.com/ajax/libs/angularjs/1.2.13/angular.min', 
    angularScroll: 'bower_components/angular-scroll/angular-scroll.min', 
    angularParallax: 'bower_components/ng-parallax/angular-parallax.min' 
    }, 
    shim: { 
    'angular': { exports: 'angular' }, 
    'angularScroll': { deps: ['angular'] }, 
    'angularParallax': { deps: ['angular'] } 
    } 
});

我使用咕嚕-的contrib-requirejs然後到所有捆綁這些庫（不是CDN的）加入到一個獨特的文件中。這是我捆綁一切後，得到：

angular.module("duParallax",["duScroll","duParallax.directive"... 
define("angularParallax", ["angular"], function(){});

但我想到的是被包裹內代碼中定義：

define("angularParallax", ["angular"], function(){ 
    angular.module("duParallax",["duScroll","duParallax.directive"... 
});

如何能夠做到最新，而不改變庫本身？

編輯： 根據這個其他的stackoverflow問題，這是它應該如何工作。但我也使用grunt-contrib-requirejs捆綁我的代碼，這可能是問題所在。

Shim from grunt-contrib-requirejs not wrapping library

來源

2014-02-20 Vincent Peres

對不起，「優先」，這是傳統的，我會刪除。正如你所看到的，Angular從CDN加載，所以它不會被捆綁在其他庫中。這意味着在我生成的文件中，「angular」還沒有定義，這就是爲什麼我期望它被包裝在「define」中，然後在「angular」變爲可用時加載。 –

您已經添加了「我使用grunt-contrib-requirejs來捆綁所有庫」這一點澄清了這個問題，所以我收回了我的評論。是的，它沒有做它應該做的事情。不幸的是，我沒有使用這個工具，所以我不知道你要做什麼。 – Louis

感謝您的幫助，我希望它能爲其他人澄清！ –

默認r.js不會換行不兼容AMD庫。您需要將以下選項添加到咕嚕-requirejs-contrib請設置：

wrapShim: true

來源

2014-02-25 13:34:56

如何打包加載了RequireJS的外部庫？

回答

相關問題