ArcGIS API for JavaScript 4.x 與 npm

標籤：default   packages   lin   save   splay   opened   eve   res   dpkg   

在4.7版本中，不僅增加了WebGL的渲染支援（渲染前端速度加快，渲染量也加大）、增強了ES6中的Promises文法支援，還支援了npm管理及webpack打包，實屬喜訊。

“意味著可以不經過esri-loader這個包來引入JsAPI了——ArcGIS極客說”

//當前未完待續

1. 前言

如果你想本機群組織起ArcGIS API for JavaScript項目，那麼從4.7開始，就可以用npm這個當下火熱的前端js包管理工具進行項目中的API管理了。

以前Esri是推薦用bower這個包管理工具的，現在推薦使用npm了，當然現在仍然能用bower，不過還是推薦用npm。

事先，你可能需要安裝：

• node.js
• git
• grunt
• java 7或更高版本

事實上，你只需要安裝node.js即可。其他三個可以根據需要安裝。

2. 如何安裝

一行代碼

npm install arcgis-js-api --save或npm install arcgis-js-api或npm i arcgis-js-api

如果下載完成，node_modules檔案夾內應該會出現這樣的資料夾清單：

3. 配置

以下為配置dojoConfig的有關代碼。

// create or use existing global dojoConfigvar dojoConfig = this.dojoConfig || {};(function() {  var config = dojoConfig;  // set default properties  if (!config.hasOwnProperty("async")) {    config.async = true;  }  // add packages for libs that are not siblings to dojo  (function() {    var packages = config.packages || [];    function addPkgIfNotPresent(newPackage) {      for (var i = 0; i < packages.length; i++) {        var pkg = packages[i];        if (pkg.name === newPackage.name) {          return;        }      }      packages.push(newPackage);    }    addPkgIfNotPresent({      name: "app",      location: "./../../src/app"    });    addPkgIfNotPresent({      name: "esri",      location: "../arcgis-js-api"    });    addPkgIfNotPresent({      name: "@dojo",      location: "../@dojo"    });    addPkgIfNotPresent({      name: "cldrjs",      location: "../cldrjs",      main: "dist/cldr"    });    addPkgIfNotPresent({      name: "globalize",      location: "../globalize",      main: "dist/globalize"    });    addPkgIfNotPresent({      name: "maquette",      location: "../maquette",      main: "dist/maquette.umd"    });    addPkgIfNotPresent({      name: "maquette-css-transitions",      location: "../maquette-css-transitions",      main: "dist/maquette-css-transitions.umd"    });    addPkgIfNotPresent({      name: "maquette-jsx",      location: "../maquette-jsx",      main: "dist/maquette-jsx.umd"    });    addPkgIfNotPresent({      name: "tslib",      location: "../tslib",      main: "tslib"    });    config.packages = packages;  })();  // configure map.globalize  var map = config.map || {};  if (!map.globalize) {    map.globalize = {      "cldr": "cldrjs/dist/cldr",      "cldr/event": "cldrjs/dist/cldr/event",      "cldr/supplemental": "cldrjs/dist/cldr/supplemental",      "cldr/unresolved": "cldrjs/dist/cldr/unresolved"    };    config.map = map;  }})();

配置dojoConfig

 

ArcGIS API for JavaScript 4.x 與 npm