Writing in the front

Have you ever been bothered by the following questions when developing WebGIS projects?

  • How to configure ArcGIS API for JavaScript in Vue or React framework;
  • I understand the knowledge points of each API module in ArcGIS API for JavaScript, but I don’t know how to organize the specific function development.
  • How to configure Vue routing and global status management? How to configure Vue routing and global status management when switching to React?
  • What plug-ins are needed in a complete WebGIS project, and how to match the different versions of these plug-ins?
  • …

If you have the same or more doubts, you will be interested in the rest of this article. Keep your curiosity as we move on.

WebGIS scaffolding tools

With just one command, you can create a complete WebGIS project, with routing, global status management, map API, and everything else ready for you to use. Isn’t it comfortable to think about it? Yes, this article introduces such a tool – CDmap-CLI. Cdmap-cli allows you to create a complete WebGIS project directly with one command, It saves you the time to install ArcGIS API for JavaScript, Vue Router, Vuex, Element UI or Ant Design in previous project development process. It also shows you how the code in your project will be organized and where the related components will be stored. With CDMAP-CLI, you can complete project creation, plug-in installation, and project startup in just five minutes, saving you nearly a day’s work.

Cdmap – CLI installation, project creation & startup

To install cdmap-CLI, you must have nodeJS installed on your computer. If you do not have nodeJS installed, you are advised to install nodeJS. After installing nodeJS, we simply install cdmap-cli from the command line with the following command:

npm i cdmap-cli -g
Copy the code

After installing cdmap-CLI, you can create the project by using the following command:

cdmap create
Copy the code

After the preceding command is executed, interactive information about project creation is displayed. You only need to fill in related information and select the corresponding framework as follows:



After filling in the corresponding information, the project can be created. After the project is created, the project startup command will appear. You can follow the following commands:

CD < project name > NPM I NPM run serveCopy the code



After the project is started, you can see the following interface:

Is it convenient? Meanwhile, the application example of ArcGIS API for JavaScript is provided in the project code template. We can develop the functions we need by referring to its usage, which greatly reduces the development cost and learning cost.

Cdmap – CLI details

For more information about CDmap-CLI, please visit the following address:

https://www.npmjs.com/package/cdmap-cli
Copy the code

Cdmap-cli is currently under development, so it has few functions, but it can meet the basic requirements of the project. If you need more functions and configurations, please pay attention to the subsequent updates.

Error handling

1. Since the ArcGIS API for JavaScript configured in CDMAP-CLI is the latest version (version 4.18), NCP tool is used in the code, so it is necessary to install NCP tool before using it, and the command is as follows:

npm i ncp -g
Copy the code

2. After the project is created, the installation of dependency packages through NPM I may be delayed or suspended due to network problems. Please stop the installation and repeat the NPM I command to install dependency packages until the installation is successful.