How can I use arcgis js in Vue js

There are several example in docs of arcgis, but I can’t use it properly. When I import Map from arcgis like shown as in that example:

import Map from '@arcgis/Map'

It gives error in browser which not found ersi like that

Why it tries to download files from assets?

Answer

Using the ArcGIS JS API with ES modules, you need to copy the @arcgis/core/assets to the build directory.

This can be done using the ncp npm module and setup npm scripts like such.

// 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"
    }
}

It is the way the ArcGIS JS API documentation lists how to do it. https://developers.arcgis.com/javascript/latest/es-modules/

Alternatively if you use Webpack, you can use the copy-webpack-plugin to accomplish it as well. https://www.npmjs.com/package/copy-webpack-plugin then in your webpack.config.js

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