Vue 项目离线安装 ArcGIS for JavaScript

注意: arcgis-js-api在4.18及之后版本,可以通过 npm install @arcgis/core@4.18.1 直接安装

在写些博客时,npm能安装的最新版为4.28.10,下面以4.28.10为例,讲解离线安装。
在vue3项目中,通过npm install @arcgis/core@4.28.10安装,但默认是半本地化的,因为assests资源是通过https://js.arcgis.com在线请求的。
需要把相关内容通过https://js.arcgis.com域名加载的assets资源制制到public目录下,然后在main.ts入口文件中修改assetsPath配置即可

import '@arcgis/core/assets/esri/themes/light/main.scss'
import esriConfig from '@arcgis/core/config'
esriConfig.assetsPath = '/assets' //或写完整 '/public/assets'

执行npm install ncp,安装ncp包,用来拷贝
在package.json文件下, 添加copy命令

{
  "name": "vue-project-name",
  "private": true,
  "version": "0.0.0",
  "scripts": {
    "dev": "vite --host", // vite默认dev,webpack默认serve
    "build": "vite build",
    "preview": "vite preview",
    "copy": "ncp ./node_modules/@arcgis/core/assets ./public/assets"
  },
  "dependencies": {
    ......
  }
  "devDependencies": {
    .....
  }
  ......
}

执行npm run copy,拷贝环境到本地

posted @ 2024-01-15 15:18  lqqgis  阅读(87)  评论(0编辑  收藏  举报