Làm cách nào để kết hợp các plugin Gạch dưới trong RequireJS?

Question

Cách đúng để thực thi mã trên Gạch dưới khi được tải là gì? Tôi đang cố gắng thực thi mã bên dưới để tự động mở rộng vùng tên _ export khi các mô-đun yêu cầu nó:

_.mixin(_.str.exports()); 

Tài liệu hơi mơ hồ nhưng tôi nghĩ rằng tôi đặt nó trong phần init shim? Tôi cố gắng dưới đây nhưng tôi thậm chí không thể có được một breakpoint để đánh vào init:

require.config({ 
    paths: { 
     jquery: 'libs/jquery/jquery.min', 
     underscore: 'libs/underscore/lodash.min', 
     underscorestring: 'libs/underscore/underscore.string.min' 
    }, 

    shim: { 
     underscore: { 
      exports: '_' 
     } 
     underscorestring: { 
      deps: ['underscore'], 
      init: function (_) { 
       //Mixin plugin to namespace 
       _.mixin(_.str.exports()); 

       return _; 
      } 
     } 
    } 
}); 

Khi tôi cố gắng làm điều này và sử dụng underscorestring, tôi nhận được lỗi này:

Uncaught TypeError: Object function s(e){return new o(e)} has no method 'startsWith'

Documents:

• http://requirejs.org/docs/api.html#config-shim
• http://requirejs.org/docs/api.html#config-callback

Answer 1

Tôi không biết nếu đó là cách chính xác, nhưng tôi đã nhận nó làm việc bằng cách đảo ngược mọi thứ để gạch mà phụ thuộc vào underscore.string . Ngoài ra, theo cách này bạn không cần phải yêu cầu underscore.string.

require.config({ 
    shim: { 
    'backbone': { 
     deps: ['underscore', 'jquery'], 
     exports: 'Backbone' 
    }, 
    'underscore': { 
     deps: ['underscore.string'], 
     exports: '_', 
     init: function(UnderscoreString) { 
     _.mixin(UnderscoreString); 
     } 
    } 
    }, 
    paths: { 
    'backbone'   : 'lib/backbone', 
    'jquery'   : 'lib/jquery/jquery', 
    'text'    : 'lib/require/text', 
    'underscore'  : 'lib/underscore', 
    'underscore.string' : 'lib/underscore.string' 
    } 
}); 

.

Cập nhật: 3/14/2014

Underscore.js v1.6.0 mang lại khả năng tương thích bộ xử lý AMD và init() đã bị xóa khỏi RequireJS, vì vậy một số refactoring là theo thứ tự. Để tiếp tục nhận được Underscore được tải trước bằng Underscore.string, tôi đã tạo một mô-đun trộn để kéo chúng lại với nhau.

_{New Require.js cấu hình}

requirejs.config({ 
    paths: { 
    'backbone'   : '../lib/backbone/backbone', 
    'backbone.base'  : '../lib/backbone/backbone.base', 
    'backbone.extensions' : '../lib/backbone/backbone.extensions', 
    'jquery'    : '../lib/jquery/jquery', 
    'text'    : '../lib/require/text', 
    'underscore'   : '../lib/underscore/underscore', 
    'underscore.mixed' : '../lib/underscore/underscore.mixed', 
    'underscore.string' : '../lib/underscore/underscore.string' 
    }, 
    shim: { 
    'backbone.base': { 
     deps: ['underscore.mixed', 'jquery'], 
     exports: 'Backbone' 
    }, 
    } 
}); 

_{underscore.mixed}

define([ 
    'underscore', 
    'underscore.string' 
], function(_, _s) { 
    _.mixin(_s.exports()); 
    return _; 
}); 

Bước cuối cùng là để thay thế tất cả các trường hợp của 'underscore' với 'underscore.mixed' trong định nghĩa module. Tôi đã cố gắng di chuyển dấu gạch dưới vào một tệp có tên là underscore.base.js và tạo máy trộn thông thường underscore (như thiết lập Backbone) để tránh bước này. Gạch dưới, là một mô hình có tên, không đồng ý với kế hoạch.

Answer 2

Bạn có yêu cầu nhấn mạnh một nơi nào đó không? Bởi vì nếu nó không được yêu cầu, nó sẽ không được tải. tôi quản lý để làm cho nó làm việc với gần như chính xác cùng mã bạn được đăng:

require.config({ 
    paths: { 
     underscore: [ 
      '//raw.github.com/documentcloud/underscore/master/underscore-min' 
     , 'lib/underscore' 
     ] 
    , underscorestring: 'https://raw.github.com/epeli/underscore.string/master/dist/underscore.string.min' 
    } 
, shim: { 
     underscore: { exports: '_' }, 
     underscorestring: { 
      deps: ['underscore'], 
      init: function(_) { 
       _.mixin(_.str.exports()); 
       return _; // guess, this is not needed. 
      } 
     } 
    } 
, exclude: ['underscore'] 
}); 

require(['underscore', 'underscorestring'], function(_) { 
    console.log(_.chars("i'm a happy string.")); 
}); 

Answer 3

Battling với điều này trong nhiều giờ trước khi tôi hiểu những gì tôi đang làm sai

Đây là những gì tôi đã làm sai

Bạn không nên đổi tên các tập tin underscore.string trong chính.js

mặc dù trong thư viện của tôi, tôi đã làm đổi tên file trong đường dẫn tôi đặt tên cho nó trở lại 'underscore.string'

Đây là cách bạn main.js nên trông giống như

require.config({ 
paths: { 
    underscore: 'lib/underscore', 
    'underscore.string' : 'lib/_string' , 
}, 
shim: { 
    underscore: { 
     exports: '_', 
     deps: [ 'jquery', 'jqueryui' ] 
    }, 
    'underscore.string': { 
     deps: [ 'underscore' ] 
    }, 
} 
.... 

Sau đó bạn có thể thêm nó như là phụ thuộc với trong shim của bạn như tôi đã làm cho tập tin mixin của tôi

shim: { 
    mixin : { 
     deps: [ 'jquery', 'underscore', 'underscore.string' , 'bootstrap' ] 
    }, 

Hoặc chỉ cần xác định nó trong các trang khác nhau của bạn như

/*global define */ 
define([  
    'underscore.string' 
], function () { 

nó chỉ làm việc bây giờ bạn có thể truy cập nó thông qua _.str hoặc _.string

Đây là lý do tại sao bạn nên làm theo cách này và không cố gắng để đặt tên cho nó cái gì khác

trên đường dây 663 của underscore.string.js

// Register as a named module with AMD. 
    if (typeof define === 'function' && define.amd) 
    define('underscore.string', [], function(){ return _s; }); 

Có nghĩa là nó sẽ chỉ đăng ký với AMD yêu cầu JS nếu bạn đang định 'underscore.string'

Đối Mix tại bạn chỉ có thể xác định với

/*global define */ 
define([  
    'underscore', 
    'underscore.string' 
], function () { 
    _.mixin(_.str.exports());