3

vue-admin自定义后台管理系统(二)之vue-cli3创建前端项目

安装vue-cli3

vue-cli官方文档

使用vue-cli3创建vue-admin项目

安装完vue-cli3后请使用'vue --version' 测试vue版本是不是3.x版本

测试vue-cli版本

你也可以通过 vue ui 命令以图形化界面创建和管理项目:

vue ui

启动图形化界面

在浏览器中访问网址: http://localhost:8000 查看图形化界面

配置项目名、包管理器,是文件夹已存在是否覆盖、git初始化等信息

创建新项目--项目名、包管理器等基础配置

选择手动配置

创建项目--选择配置--手动配置

选择初始化包依赖

创建项目--选择初始化包依赖

配置具体的依赖、创建项目

创建项目--配置具体的依赖

创建项目,不设置预设

预设,你可以理解成模板,保存为预设后,下次创建项目时,可以选择预设快速创建项目

点击创建项目、不保存预设后,需要等待一下,vue-cli在后台初始化项目,下载依赖,安装插件等,稍等即可

创建项目,不设置预设

安装CLI插件

安装依赖

使用vue-cli3安装依赖

安装依赖

找到依赖菜单

clipboard.png

进入项目依赖页面

clipboard.png

搜索安装需要的依赖

clipboard.png

我们依次安装axios等插件

使用vue-cli3来启动项目

在vue-cli2的时候我们初始化项目完成后,vue-cli2在控制台提示我们

cd  项目路径
npm run dev 启动项目

现在在vue-cli3可以直接使用图形化界面来启动项目

clipboard.png

启动项目,注意端口占用情况

clipboard.png

其他功能请自行摸索。


残风
5 声望2 粉丝