arcgis在webpack中的使用

时间: 2019-06-02阅读: 701标签: 模块

因为dojo本身带有模块加载的功能,会与webpack本身有冲突,所以需要借助esriLoder。


安装

npm i esri-loader


使用esri-loader

esri-loader暴露了loadcss和loadModules两个方法,分别用来加载cssjs文件。
引入

import { loadcss,loadModule } from 'esri-loader'


loadcss的使用

自动加载cdn上最新版本的arcgis的css

loadcss()

加载制定路径的arcgis的css

loadcss('http://115.29.42.107:8686/410/esri/css/main.css')


loadModules的使用

代替之前的dojo,传入需要的模块与配置项,返回一个promise对象,then中的参数为返回模块,示例:

import { loadModules } from 'esri-loader';
 
// if the API hasn't already been loaded (i.e. the frist time this is run)
// loadModules() will call loadScript() and pass these options, which,
// in this case are only needed b/c we're using v3.x instead of the latest 4.x
const options = { version: '3.28' };
 
loadModules(['esri/map'], options)
  .then(([Map]) => {
    // create map with the given options at a DOM node w/ id 'mapNode'
    let map = new Map('mapNode', {
      center: [-118, 34.5],
      zoom: 8,
      basemap: 'dark-gray'
    });
  })
  .catch(err => {
    // handle any script or module loading errors
    console.error(err);
  });

option已知配置项:

option = {
    version: 4.7, // 在线加载js时使用选择版本号
    url: 'http://115.29.42.107:8686/410/init.js', // 制定路径加载arcgis的js,需指向init.js的路径
    dojoConfig: {  // 配置dojo
        baseUrl: config.dojoUrl  // 需指向dojo目录
    }
}

如果你是在线使用最新的无需配置,需要在线使用某个版本配置version

如果你部署js的api,需要配置url和dojoConfig。


站长推荐

1.云服务推荐: 国内主流云服务商,各类云产品的最新活动,优惠券领取。地址:阿里云腾讯云华为云

2.广告联盟: 整理了目前主流的广告联盟平台,如果你有流量,可以作为参考选择适合你的平台点击进入

链接: http://www.fly63.com/article/detial/3607

Javascript模块的写法-AMD, CMD, CommonJS和UMD

Javascript模块的写法-AMD, CMD, CommonJS和UMD。JavaScript中出现了一些非传统模块开发方式的规范 CommonJS的模块规范,AMD,CMD等。

module、export、require、import的使用

module每个文件就是一个模块。文件内定义的变量、函数等等都是在自己的作用域内,都是自身所私有的,对其它文件不可见。在module中有一个属性exports,即:module.exports。它是该模块对外的输出值,是一个对象。

node.js ES模块

例如在 ECMAScript 5 中引入的许多程序员首选的严格模式曾经是可选的,必须明确启用才行,同时它在 ES 模块中始终处于活动状态。因此,以下代码段在语法上可以解释为传统的 JavaScript 代码和 ES 模块

JavaScript 模块化简析

关于模块化,最直接的表现就是我们写的 require 和 import 关键字,如果查阅相关资料,就一定会遇到 CommonJS 、CMD AMD 这些名词,以及 RequireJS、SeaJS 等陌生框架。比如 SeaJS 的官网 这样描述自己: “简单友好的模块定义规范

NodeJS模块os - 与操作系统“打交道”

nodejs 提供了os.platform()和os.type(),可以用来识别操作系统平台。推荐使用: os.platform(),平均负载是指:单位时间内,系统处于可运行状态和不可中断状态的平均进程数。它和 cpu 使用率没有直接关系。

利用Proxy,如何优雅实现JSBridge模块化封装

最近公司在做一个项目,通过把我们自己的Webview植入第三方APP,然后我们的业务全部通过H5实现。至于为什么不直接用第三方APP WebView,主要是身处金融行业,需要做一些风控相关功能

关于export和export default你不知道的事

网上有很多关于export和export default的文章,他们大部门都是只讲了用法,但是没有提到性能,打包等关键的东西。大家应该应该能理解import * from xxx会把文件中export default的内容都打包到文件中,而import {func} from xxx只会把文件中的func导入

Node的https模块_创建HTTPS服务器

Node的https模块:HTTPS服务器使用HTTPS协议,需要证书授权,SSL安全加密后传输,使用443端口

node.js模块的安装分哪两种方式?

NPM是随同NodeJS一起安装的包管理工具,能解决NodeJS代码部署上的很多问题,常见的使用场景有以下几种:允许用户从NPM服务器下载别人编写的第三方包到本地使用。允许用户从NPM服务器下载并安装别人编写的命令行程序到本地使用。

Node.js使用Kafka-node模块实现生产者与消费者

基于Node.js,采用Kafka-node模块实现生产者与消费者,我正在做一个的项目,我在自己的服务器上有一个Kafka生产者,并使用Kafka-Node作为我的应用程序的消费者。

点击更多...

内容以共享、参考、研究为目的,不存在任何商业目的。其版权属原作者所有,如有侵权或违规,请与小编联系!情况属实本人将予以删除!

文章投稿关于web前端网站点搜索站长推荐网站地图站长QQ:522607023

小程序专栏: 土味情话心理测试脑筋急转弯幽默笑话段子句子语录成语大全运营推广