概述
Vue-cli是Vue的脚手架,类似Java中的SpringBoot框架,用于搭建一个标准的项目。
Vue-cli大大降低了webpack的使用难度,支持热部署,有webpack-dev-server的支持,相当于启动了一个请求服务器作为测试环境,我们只关注开发就可以了。
安装Vue-cli
-
安装NodeJS
需要安装Node.js
官网:https://nodejs.org/zh-cn/
安装后配置环境变量:在Path中添加NodeJS的全局安装路径:
-
npm工具
NodeJS的包管理工具,类似Maven,安装Node.js后就有了
基本命令:
npm -v 查看版本
npm install 包名 --save 安装
npm uninstall 包名 --save 卸载
- nrm工具
npm默认站点在国外,配置国内镜像,提高下载速度
npm install nrm -g 安装nrm -g全局安装
nrm ls 查看镜像
nrm use 镜像名 使用镜像
- 安装Vue-Cli
npm install -g @vue/cli
vue --version
创建Vue项目
进入cmd控制台,切换到项目目录后输入:
vue create 项目名
箭头切换到Manually select features,选择手动选择特性,回车
目前只选择Router,其他的都去掉(空格),回车
是否使用History路由方式,输入n,回车
配置写在哪里,这里选package.json,回车
是否保存配置,输入n,回车
等待一下,项目就创建好了
运行项目
这里用IDEA打开项目,要开发Vue项目,IDEA需要安装Vue.js插件:
项目结构如下:
打开Terminal窗体,输入:npm run serve
启动项目后,在浏览器输入:http://localhost:8080
结束语
本文就到这里了,如果对你有用的话,就点个赞吧:)
大家如果需要学习其他Java知识点,戳这里 超详细的Java知识点汇总