首页 > 解决方案 > 如何在 Vue js 中使用 arcgis js

问题描述

arcgis 的文档中有几个示例,但我无法正确使用它。当我从 arcgis 导入 Map 时,如该示例所示:

import Map from '@arcgis/Map'

它在没有找到那样的 ersi 的浏览器中给出错误在此处输入图像描述

为什么它会尝试从资产中下载文件?

标签: javascriptvue.jsarcgis

解决方案


使用带有 ES 模块的 ArcGIS JS API,您需要将其复制@arcgis/core/assets到构建目录。

这可以使用ncpnpm 模块和类似的设置 npm 脚本来完成。

// package.json
{
    "script": {
        "start": "npm run copy && react-scripts start",
        "build": "npm run copy && react-scripts build",
        "copy": "ncp ./node_modules/@arcgis/core/assets ./public/assets"
    }
}

这是 ArcGIS JS API 文档列出如何执行此操作的方式。https://developers.arcgis.com/javascript/latest/es-modules/

或者,如果您使用 Webpack,您也可以使用copy-webpack-plugin来完成它。https://www.npmjs.com/package/copy-webpack-plugin然后在你的webpack.config.js

const CopyWebpackPlugin = require('copy-webpack-plugin');
plugins: [
    new CopyWebpackPlugin([
        { from: './node_modules/@arcgis/core/assets', to: './public/assets' },
    ]
  ],

推荐阅读