explaingit

vuecomponent/ant-design-vue-pro

10,946VueAudience · developerComplexity · 3/5LicenseSetup · moderate

TLDR

A Vue 2 enterprise admin dashboard starter template built on Ant Design, with pre-built authentication flows, charts, data tables, and a complete application shell ready to connect to your backend.

Mindmap

mindmap
  root((ant-design-vue-pro))
    What it does
      Enterprise dashboard template
      Vue 2 starter
    Tech stack
      Vue 2
      Ant Design Vue
      AntV G2
      Webpack
    Features
      Auth flows
      Charts and tables
      Profile section
      Mock data layer
    Audience
      Vue developers
      Enterprise teams
Click or tap to explore — scroll the page freely

Code map

Detail Auto

An interactive map of this repo's files and how they connect — its source is parsed live in your browser. Click Visualize to build it.

filefunction / class

Things people build with this

USE CASE 1

Use as a starting point for an enterprise internal dashboard so you skip building authentication and navigation from scratch.

USE CASE 2

Wire in your own backend API to replace the mock data layer and ship a production admin panel.

USE CASE 3

Build chart-heavy analytics dashboards using the bundled AntV G2 charting library.

USE CASE 4

Customize the Ant Design visual language for your company's branding and add new pages to the routing structure.

Tech stack

Vue 2Ant Design VueWebpackAntV G2Yarn

Getting it running

Difficulty · moderate Time to first run · 30min

Vue 3 is not supported, a separate paid Vue 3 version exists, confirm you need Vue 2 before starting.

Use freely for any purpose, including commercial use, as long as you keep the copyright notice.

In plain English

Ant Design Vue Pro is a starter template for building enterprise admin dashboards using Vue 2. It bundles together a set of pre-built interface components, a layout structure, and common admin features so that a development team does not have to assemble these pieces from scratch when starting a new internal web application. The template is based on Ant Design of Vue, which is a port of Ant Design, a Chinese technology company's widely used design system originally made for React. This Vue version brings the same visual language, including tables, forms, menus, charts, and modal dialogs, to Vue projects. The Pro template adds a complete application shell around those components, with things like authentication flows, dashboard pages with charts powered by the AntV G2 charting library, and a profile section with an image cropper. It is set up to use Vue CLI 3, Webpack for bundling, and Yarn as the package manager. Getting started involves cloning the repository, running the install command, then running the development server. A production build compresses and optimizes the output for deployment. The README notes that mock data used during development is disabled in production builds, so teams connecting it to a real backend need to wire up their own API calls. This repository is for Vue 2 only. A Vue 3 version exists as a separate paid product. The template supports modern browsers including Internet Explorer 10 and above. The project is aimed at developers who already know Vue and want a structured starting point for a business dashboard rather than something aimed at non-technical users. It is open-source and MIT-licensed.

Copy-paste prompts

Prompt 1
I'm using ant-design-vue-pro and need to replace the mock data with real API calls to my backend. Walk me through disabling the mock layer and wiring up authenticated requests.
Prompt 2
Help me add a new page to ant-design-vue-pro with a paginated data table that fetches from a REST API endpoint I provide.
Prompt 3
I want to show a line chart of sales data over time using the AntV G2 integration in ant-design-vue-pro. Show me the component setup and the data format it expects.
Prompt 4
How do I build and deploy ant-design-vue-pro for production and make sure the mock data layer is completely disabled?
Prompt 5
I need to add a new menu item in ant-design-vue-pro's sidebar that links to my new page. Where are the routes and menu config defined?
Open on GitHub → Explain another repo

← vuecomponent on gitmyhub — every repo by this author, as a profile.

Verify against the repo before relying on details.