@arcgis/core

A minified, unbuilt version of the ArcGIS Maps SDK for JavaScript ES modules.

Features

For an overview of the SDK, visit the developer documentation site.

You can install this package with npm and then use it directly in a framework such as React, Vue.js or Angular. Or, you can also create your own custom builds with a module bundler such as Webpack or Rollup.

The SDK includes TypeScript type definitions. The .d.ts declaration files are bundled with the install.

For more information on using the next versions, visit the feedback-js-api-next repository.

Sample applications can be found at github.com/Esri/jsapi-resources/.

Get started

Install the package into your project:

npm install @arcgis/core

Configure CSS

Set the CSS to the same version as the installed package. You can verify the installed SDK version by running npm list @arcgis/core. If you are working with locally hosted assets skip to the Manage assets locally section.

The first example shows importing CSS for the latest SDK version: 4.28.7:

index.css

@import "https://js.arcgis.com/4.28/@arcgis/core/assets/esri/themes/light/main.css";

Working with assets

The default configuration for local builds is for the SDK to automatically pull assets from a CDN at runtime. There is no need for additional configuration. The assets include styles, images, web workers, wasm and localization files. latest and rc versions of the SDK's assets are hosted on the ArcGIS CDN, while next versions use assets hosted on the jsDelivr CDN.

Manage assets locally

If you need to manage the assets locally, copy them into your project from /node_modules/@arcgis/core/assets, and then set config.assetsPath to ensure requests for assets are resolved correctly. A simple way to accomplish this is to configure an npm script that runs during your build process. For example, use cp on MacOS and Windows PowerShell, or xcopy on Windows, and configure a script in the package.json to copy the folder.

Important: Every time you upgrade the SDK, be sure to recopy the new version of the assets into your project. This ensures the assets and API library stay synchronized.

Here’s a React example:

package.json

{
  "scripts": {
    "start": "cp -R ./node_modules/@arcgis/core/assets ./public/assets && react-scripts start",
    "build": "cp -R ./node_modules/@arcgis/core/assets ./public/assets && react-scripts build"
  }
}

App.js

import esriConfig from "@arcgis/core/config.js";
esriConfig.assetsPath = "./assets";

index.css

@import "@arcgis/core/assets/esri/themes/light/main.css";

For Angular, one example is to copy the asset files by configuring the architect/build/options/assets section of angular.json, for example:

angular.json

{
  "assets": [
    {
      "glob": "**/*",
      "input": "node_modules/@arcgis/core/assets",
      "output": "/assets/"
    }
  ]
}

app.component.ts

import esriConfig from "@arcgis/core/config.js";
esriConfig.assetsPath = "./assets";

app.component.css

Add the following line at the top of the css file:

@import "@arcgis/core/assets/esri/themes/light/main.css";

For other installations, consider using this npm script as a starting point:

package.json

{
  "script": {
    "copy": "cp -R ./node_modules/@arcgis/core/assets ./dist/assets"
  }
}

Requirements

Use of the ArcGIS Maps SDK for JavaScript is subject to System Requirements, and the terms described in the product-specific Terms of Use. Learn more about licensing here.

Resources

• ArcGIS Maps SDK for JavaScript - Build with ES modules
• http://blogs.esri.com/esri/arcgis/tag/javascript/
• twitter@EsriDevs

Issues

• General questions about using these modules or the ArcGIS Maps SDK for JavaScript? See the Esri developer community.
• Technical support.

Licensing

COPYRIGHT © 2023 Esri

All rights reserved under the copyright laws of the United States and applicable international laws, treaties, and conventions.

This material is licensed for use under the Esri Master License Agreement (MLA), and is bound by the terms of that agreement. You may redistribute and use this code without modification, provided you adhere to the terms of the MLA and include this copyright notice.

For additional information, contact: Environmental Systems Research Institute, Inc. Attn: Contracts and Legal Services Department 380 New York Street Redlands, California, USA 92373 USA

email: contracts@esri.com