arcgis在webpack中的使用

53次阅读

共计 1106 个字符,预计需要花费 3 分钟才能阅读完成。

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

安装

npm i esri-loader

使用 esri-loader

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

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。

正文完
 0