使用vue-cli3创建vue项目
1.下载安装vue-cli3，这里我使用npm安装
1 | npm install -g @vue/cli
安装完成后可以通过vue --version命令查看版本
vue --version
也可以使用简写
vue -v
出现下图代表安装成功:
vue-v.png
2.创建一个项目
使用vue新的图形化项目管理器
vue ui
vue-ui.png
等待几秒,会默认打开网址 http://localhost:8000 这里的端口可能会与我不同
创建项目.png
选择文件夹,在此创建项目
第一步:
第一步.png
第二步: 没有特殊需求建议默认
第二步.png
此处有一个新手容易踩得雷区,默认配置下, eslint 的代码规范会非常严格,如果需要关闭,可以百度,后续有空的时候,我也会出一篇有关 eslint 介绍以及如何关闭.
安装中.png
第三步: 安装成功后, 任务--sever--运行--启动app
运行.png
第四步: 完成,项目启动成功
完成.png
到这里,完整的Cli3构建的Vue项目就算是完成了,总的来说,Cli3的图形化工具让我们构建项目,方便了很多.
同时Cli3也有更多的功能,需要熟悉以后再去深入的研究.
附上Vue Cli3构建的项目目录:
目录.png
明天会分析Vue Cli3的项目目录
网友评论