{"id":407062,"date":"2021-02-22T19:59:11","date_gmt":"2021-02-23T03:59:11","guid":{"rendered":"https:\/\/www.esri.com\/about\/newsroom\/?post_type=arcuser&p=407062"},"modified":"2021-02-22T19:59:11","modified_gmt":"2021-02-23T03:59:11","slug":"simplify-integrating-frameworks-and-build-tools","status":"publish","type":"arcuser","link":"https:\/\/www.esri.com\/about\/newsroom\/arcuser\/simplify-integrating-frameworks-and-build-tools","title":{"rendered":"Simplify Integrating Frameworks and Build Tools"},"author":1031,"featured_media":0,"menu_order":0,"template":"","format":"standard","meta":{"_acf_changed":false,"sync_status":"","episode_type":"","audio_file":"","podmotor_file_id":"","podmotor_episode_id":"","castos_file_data":"","cover_image":"","cover_image_id":"","duration":"","filesize":"","filesize_raw":"","date_recorded":"","explicit":"","block":"","itunes_episode_number":"","itunes_title":"","itunes_season_number":"","itunes_episode_type":"","_links_to":"","_links_to_target":""},"categories":[10722,25002],"tags":[473352,473342,419072],"arcuser_issues":[473092],"class_list":["post-407062","arcuser","type-arcuser","status-publish","format-standard","hentry","category-arcgis-api-for-javascript","category-developers-corner","tag-asynchronous-module-definition","tag-es-modules","tag-productivity","arcuser_issues-arcuser-winter-2021"],"acf":{"short_description":"If you use the ArcGIS API for JavaScript with a 3rd party frameworks or create custom builds of the API, this process just got easier.","pdf":{"host_remotely":false,"file":407152,"file_url":""},"flexible_content":[{"acf_fc_layout":"blockquote","content":"If you use the ArcGIS API for JavaScript with a third-party framework such as Angular or React or create custom builds of the API, this process just got easier. The release of version 4.18 in December introduced a new option for consuming the ES modules, which work natively in the browser, are built to the latest ECMA standards, and allow seamless integration with modern frameworks and build tools."},{"acf_fc_layout":"content","content":"

How Was the API Consumed Before ES Modules Were Available?<\/h2>\r\nThe API has always been available as Asynchronous Module Definition (AMD) modules, and it continues to be available as AMD modules for developers who prefer this format. If your app references Esri\u2019s content delivery network (CDN) to access the API via https:\/\/js.ArcGIS.com\/<API version number>, you are using the AMD version.\r\n

Understanding AMD and ES Modules<\/h2>\r\nWith both AMD and ES modules, API functionality is divided into logical subsets and packaged as modules. AMD modules use a require() method and a third-party script loader to load modules and their dependencies.\r\n\r\nES modules are an official, standardized module system that works natively with all modern browsers through import statements. ES modules do not require a separate script loader. An example showing the differences between the two coding patterns is shown in Listing 1.\r\n\r\n "},{"acf_fc_layout":"image","image":407182,"image_position":"center","orientation":"horizontal","hyperlink":""},{"acf_fc_layout":"image","image":407192,"image_position":"center","orientation":"horizontal","hyperlink":""},{"acf_fc_layout":"content","content":"

Should You Migrate to ES Modules?<\/h2>\r\nIf you aren\u2019t integrating with a framework or creating custom builds of the API, there is no need to migrate to the new ES modules. The AMD modules will continue to be available alongside the ES modules for the foreseeable future. Both formats have the same capabilities because they are built from the same code base.\r\n\r\nAMD modules are hosted on the CDN and therefore offer these benefits when accessing the API in this manner, as opposed to creating custom builds:\r\n