This topic describes how to use desktop development tools, including download and installation, logon, workspace management, and component management, to help you quickly use desktop development tools to develop components and publish them.
Download and install desktop development tools
Log on to the DataV console.
In the Component Development section, click Component Package.
Click Download Developer Tools.
In the Select Version to Download dialog box, select a version and click Download.
The system provides three versions of tools for you to choose from: MAC, WIN, and Terminal:
MAC: for macOS operating system.
WIN: for Windows operating system.
Terminal: This method is applicable to the Linux operating system. After you click Download, you will be redirected to the Quick Start for Component Development section of the Developer Guide. For more information, see Install the development tool kit.
(MAC and WIN versions) After the download is complete, double-click the application to install it.
Log on to the desktop development tool
After the installation is complete, double-click to open the tool, fill in the login information to log in, or choose not to log in offline development.
ImportantThe publish feature cannot be used for offline development. Use it with caution.
Parameter
Description
Username
The Alibaba Cloud account that is used to log on to DataV.
Token
The identifier of the developer. On the My Widgets tab of the DataV console, click My Widgets, copy the Developer ID, and paste it to the input box.
After the logon is successful, click Switch User to return to the logon page.
Create Workspace
On the Developer Tools page, click + Create Workspace in the lower-right corner.
Select a local folder as the package management folder.
Click Select Folder to create a workspace.
NoteA workspace is just a folder that contains many components. It can have the same name as an online component package, or it can have the same name.
If a folder that contains components already exists, you can open the folder. The tool automatically identifies the DataV components in the folder.
Workspace overview
After the workspace is created, it is displayed on the right side of the page. Click the workspace name to go to the Workspaces page. The Workspace page contains the following four sections: 
No. | Component | Description |
1 | Sidebar | Contains functions such as hiding the component bar, viewing help documents, and logging out. |
2 | Component Bar | Displays the widget list and manages the widget.
|
3 | Canvas |
|
4 | Component configuration bar | The following four panels are available: Configuration, Data, Interaction, and Publish.
|
Delete a workspace
In the workspace list, move the pointer over a workspace and click the X in the upper-right corner to delete the workspace. 
Create a component
Click + Create Component on the right side of the workspace page, or use the Ctrl + N shortcut key to create a component.
After the widget is created, the basic text widget appears on the Create Widget page.
Click the Basic Text component and configure the component as described in the following table.
Parameter
Description
Component Name
Enter a name for the component.
Component Type
Select a widget type from the drop-down list.
Publish ID
Select an available widget package from the drop-down list. If no widget package is available, click Custom to go to the DataV console and create a widget package. For more information, see Manage widget packages.
Component ID
Enter the component ID, for example, basic-text.
Click Create to create the widget.
After the widget is created, you can view the widget in the center canvas and configure the widget in the right-side configuration pane.
After the component is created, the index.js and package.json files are generated in the local component package folder. You can customize the configuration items of the component by editing these two files by referring to Component Development Package File Overview.
Preview a widget
After you create a widget, you can click a widget in the widget list on the left side of the page to view the style of the widget in the center canvas area.
Copy /Delete /Rename /View Component Details
Right-click a component and choose Make Copy, Delete, Rename, or Show Properties to copy, delete, rename, or view the details of the component.
You can also select a component and click the Copy Component or Delete Component icon in the lower part of the component bar to copy or delete the component. 
Refresh Workspace
Click the Refresh Workspace icon (
) to refresh the workspace. After you modify the configuration items of a component, you can use this feature to display the latest component configuration items.