arcgis在webpack中的使用

由於dojo自己帶有模塊加載的功能,會與webpack自己有衝突,因此須要藉助esriLoder。css

安裝

npm i esri-loader

使用esri-loader

esri-loader暴露了loadCss和loadModules兩個方法,分別用來加載css和js文件。
引入node

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

loadCss的使用

自動加載cdn上最新版本的arcgis的csswebpack

loadCss()

加載制定路徑的arcgis的cssweb

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

loadModules的使用

代替以前的dojo,傳入須要的模塊與配置項,返回一個promise對象,then中的參數爲返回模塊,示例:npm

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已知配置項:api

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目錄
    }
}

若是你是在線使用最新的無需配置,須要在線使用某個版本配置versionpromise

若是你部署js的api,須要配置url和dojoConfig。this

相關文章
相關標籤/搜索