"CommonJS для браузера", Антон Шувалов, MoscowJS 15
0 likes2,181 views
Документ предоставляет введение в CommonJS, объясняя, что это такое и как оно работает в браузере. Описаны примеры кода и зависимости, также упомянуты инструменты, такие как Browserify для упаковки модулей. В заключение, говорится о преимуществах использования CommonJS, включая доступность миллионов модулей в npm.
![(function (factory) {
"use strict";
if (typeof define === 'function' && define.amd) {
// using AMD
define(['jquery'], factory);
} else if (typeof exports !== 'undefined') {
// using CommonJS
module.exports = factory2;
} else {
// no AMD/CommonJS; invoke directly
factory(jQuery);
}
})(function($) {
"use strict";
// plugin code
});
http://dontkry.com/posts/code/browserify-and-the-universal-module-definition.html
11
Поддержка](https://image.slidesharecdn.com/commonjs-140925101249-phpapp01/85/CommonJS-MoscowJS-15-11-320.jpg)
"CommonJS для браузера", Антон Шувалов, MoscowJS 15
- 1. CommonJS в браузере Шувалов Антон 1
- 2. Что такое CommonJS? 2
- 4. Как работает CommonJS 'use strict'; var $ = require('jquery'); var counter = 0; exports.inc = function (count) { counter += count || 1; }; exports.get = function () { return counter; } 4
- 5. Как работает CommonJS (function (require, exports, …) { var var exports. exports. } 5 })(require, exports, …)
- 6. $ browserify index.js > bundle.js 6
- 7. Вложенные зависимости Jonathan:proxy.js jong$ pkgcount --duplicates NAME COUNT abbrev@1.0.5 25 accepts@1.0.7 9 amdefine@0.1.0 105 ansi-regex@0.1.0 8 ansi-regex@0.2.1 16 ansi-styles@1.0.0 26 ansi-styles@1.1.0 8 argparse@0.1.15 34 asn1@0.1.11 26 assert-plus@0.1.2 26 ast-types@0.4.8 17 async@0.2.10 60 async@0.9.0 60 …и еще 200 строк 7
- 8. Плоские зависимости // get-val.js module.exports = function init($) { return function(el){ return $(el).val(); } }; 8
- 9. Плоские зависимости // get-val.js module.exports = function init($) { return function(el){ return $(el).val(); } }; // index.js var $ = require('jquery'); var $getVal = require('get-val')($); var password = $getVal('.password'); 9
- 10. Плоские зависимости // index.js var Backbone = require('Backbone'); var $ = Backbone.$ = require('jquery'); 10
- 11. (function (factory) { "use strict"; if (typeof define === 'function' && define.amd) { // using AMD define(['jquery'], factory); } else if (typeof exports !== 'undefined') { // using CommonJS module.exports = factory2; } else { // no AMD/CommonJS; invoke directly factory(jQuery); } })(function($) { "use strict"; // plugin code }); http://dontkry.com/posts/code/browserify-and-the-universal-module-definition.html 11 Поддержка
- 12. NPM 8 629 620 downloads in the last day 121 187 099 downloads in the last week 475 001 308 downloads in the last month 12
- 13. CommonJS в браузере: - Простота - Нет шаблонного кода - Миллионы готовых модулей в NPM 13
- 14. |_~(˘▾˘~) - http://github.com/shuvalov-anton - http://twitter.com/shuvalov_anton - http://shuvalov.info 14