在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即可。其他三个可以根据需要安装。

当然,仍然可以使用IIS或Tomcat本地部署的方式进行开发,看工程需要。

2. 如何安装

一行代码

npm install arcgis-js-api --save

npm install arcgis-js-api

npm i arcgis-js-api

如果下载完成,node_modules文件夹内应该会出现这样的文件夹列表:

测试得出:最好结合VPN下载,npm墙比较高,下载较慢(本人实测大概510+s),而且下载的体积较大(130+MB),下下来的都是未经压缩的源码。

3. 配置

以下为配置dojoConfig的有关代码。

// create or use existing global dojoConfig
var 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与 npm的更多相关文章

  1. ArcGIS API for JavaScript 与 npm 之例子运行

    下载官方的demo,4.7的,在终端里跑了一下,测试成功(未打包) 在测试中精简掉了不需要的文件,使用http协议跑的(file协议不行哦) 最简单的目录如下: 我把以上文件放到一个叫demo的文件夹 ...

  2. 【1】ArcGIS API for JavaScript 4.5/4.6 本地部署

    惭愧,和我的学弟比起来,我所开始接触前端开发,ArcGIS API for JavaScript的时间和深度远远不及于他. 一年之尾,亦是一年之始,我也将正式开始我的博客生涯.本人在校学习并且做项目, ...

  3. ArcGIS API for JavaScript 入门教程[1] 渊源

    ->对于萌新,你可能需要了解一下这个东西是什么 ->对于已经知道要用这个东西的开发者,你可能需要了解一下它的底层机制 不针对大牛.龟速更新ing. 转载注明出处.博客园&CSDN& ...

  4. 基于ArcGIS API for Javascript的地图编辑工具

    最近工作上需要用ArcGIS API for Javascript来开发一个浏览器上使用的地图编辑工具,分享一下一些相关的开发经验. 我开发的地图编辑工具是根据ESRI提供的例子修改而来的,参考的例子 ...

  5. ArcGIS API for JavaScript(2)-ArcGIS Server发布要素图层服务

    1.前言 上一篇该系列的文章我们主要讲了一下基础Web地图搭建,这篇我们主要讲一下ArcGIS Server发布服务,并且如何调用服务.将自己的数据加载到Web地图当中来,实现Web端浏览数据. 2. ...

  6. ArcGIS API for JavaScript 4.0(一)

    原文:ArcGIS API for JavaScript 4.0(一) 最近ArcGIS推出了ArcGIS API for JavaScript 4.0,支持无插件3D显示,而且比较Unity和Sky ...

  7. ArcGIS API for JavaScript开发环境搭建及第一个实例demo

    原文:ArcGIS API for JavaScript开发环境搭建及第一个实例demo ESRI公司截止到目前已经发布了最新的ArcGIS Server for JavaScript API v3. ...

  8. 创建ArcGIS API for JavaScript的第一个示例程序

    原文:创建ArcGIS API for JavaScript的第一个示例程序 在上一篇博客中已经介绍了如何搭建ArcGIS API for JavaScript开发环境,如果您还没有搭建好开发环境的话 ...

  9. RequireJS加载ArcGIS API for JavaScript

    1.在main.js中配置ArcGIS API for JavaScript require.config({ paths : { //arcgisJS "esri": " ...

随机推荐

  1. kube-proxy的功能

    Kube-proxy的功能 我们知道POD的IP是动态分配的而且经常会变,所以为了可以通过一个不太容易变化的IP访问POD就会使用一个叫做service的东西,通过标签选择器和POD进行关联. Ser ...

  2. 轻量级原生 ajax 函数,支持 get/array post/array post/json

    原生js封装 function ajaxRequest(type, url, data, callback, failCallBack, header, dataType) { var url_enc ...

  3. 数据结构与算法(九):AVL树详细讲解

    数据结构与算法(一):基础简介 数据结构与算法(二):基于数组的实现ArrayList源码彻底分析 数据结构与算法(三):基于链表的实现LinkedList源码彻底分析 数据结构与算法(四):基于哈希 ...

  4. 浅谈MySQL架构体系

    一  数据库和数据库实例 在MySQL的学习研究中,存在两个非常容易混淆的概念,即数据库和数据库实例.在MySQL中,数据库和数据库实例定义如下: 数据库:存储数据的集合: 数据库实例:操作数据库的集 ...

  5. RationalRose 安装过程中无法加载镜像的问题

    前情提要:本文主要以提供关键问题的解决思路为目的,境况紧急的,在核对好所遇问题与博主是否一致后,可以直接跳到最后看解决办法即可. 另外,本文重要部分采用不同色文字,加以强调. 任务:安装Rationa ...

  6. SQL Server作业报错特殊案例

    一个作业报错,报错信息如下,从错误信息根本看不出为什么出错,手工运行作业又成功了.一时不清楚什么原因导致作业出错. Message Executed as user: NT SERVICE\SQLSE ...

  7. LeetCode算法题-Toeplitz Matrix(Java实现)

    这是悦乐书的第312次更新,第333篇原创 01 看题和准备 今天介绍的是LeetCode算法题中Easy级别的第181题(顺位题号是766).如果从左上角到右下角的每个对角线具有相同的元素,则矩阵是 ...

  8. 开源:Taurus.MVC 框架 (已支持.NET Core)

    为什么要创造Taurus.MVC: 记得被上一家公司忽悠去负责公司电商平台的时候,情况是这样的: 项目原版是外包给第三方的,使用:WebForm+NHibernate,代码不堪入目,Bug无限,经常点 ...

  9. 从壹开始前后端分离【 .NET Core2.0 +Vue2.0 】框架之三 || Swagger的使用 3.1

    常见问题 1.经常有小伙伴遇到这个错误 这是因为接口json文档定义和调用不是一个 1.定义: ConfigureServices 方法中的  services.AddSwaggerGen 注册的一个 ...

  10. Redis缓存你必须了解的!

    不管你是从事Python.Java.Go.PHP.Ruby等等… Redis都应该是一个比较熟悉的中间件.而大部分经常写业务代码的程序员,实际工作中或许只用到了set value.get value两 ...