To add the Ant-Design framework to a Vue-CLI project, we need to use the Vue-CLI plugin to install the framework as a project dependency and have it available in the global scope of the application:
- In the folder that you created your Vue-CLI project in, open Terminal (macOS or Linux) or Command Prompt/PowerShell (Windows) and execute the following command:
> vue add ant-design
- Vue-CLI will ask you how the import of the Ant-Design component should occur; we will select the Fully import option:
? How do you want to import Ant-Design-Vue?
❯ Fully import
Import on demand
- Vue-CLI will ask you whether you want to overwrite the Ant-Design LESS variables; we will choose N:
? Do you wish to overwrite Ant-Design-Vue's LESS variables? (y/N)
- Finally, Vue-CLI will ask about the main language Ant-Design will use in the project; we will select en_US:
? Choose the locale you want to load
❯ en_US
zh_CN
zh_TW
en_GB
es_ES...