AMD with RequireJS

Transcript

1. RequireJS Asynchronous  Module  Defini2on    

2. THE PROBLEM Dependency Injection Bundles get Large Script Tag Ordering

3. THE SOLUTION Asynchronous Loading Dependency Chain Construction import / using

   / require

4. AMD CommonJS RequireJS

5. define("person",  [],  func2on  ()  {          return

    {  firstName:  "",  lastName:  ""  };   })     define("employee",  ["person"],  func2on  (p)  {          return  {  base:  p,  id:  "123"  };   });  

6. // person.js   define([],  func2on  ()  {      

      return  {  firstName:  "",  lastName:  ""  };   })   // employee.js   define(["person"],  func2on  (p)  {          return  {  base:  p,  id:  "123"  };   });  

7. // synchronous loading... var employee = require("employee"); // asynchronous loading...

   require(["employee"], function (employee) { });

8. DEMO Setup  &  Consump2on   r.js  &  Building  /  Minifica2on

     Typescript  AMD  PaQerns   Control’s  conversion  to   AMD  

9. @OSBORNM github  |  twiQer  |  .com