Vue-cli 是建立vue工程的好工具,本文主要讲解它的用法。
1. 前题:安装nodejs ,
先去这里下 Download | Node.js ,然后选对应的版本。一般选 Windows Installer (.msi)。
2. 安装完nodejs , 重启下电脑 ,注意接下来全程联网,请注意网络畅通。
进入 cmd 键入: npm install -g @vue/cli@4.5.13 后等待安装完成
( 如果安装过旧版本的 vue-cli(1.x 或 2.x)要先卸载它,命令为:npm uninstall vue-cli -g )
3. 安装完成后,cmd 中键入: vue -V (查看版本)
4.在cmd中键入: vue create web3207
(注意 web3207 是目录名,可以自己定义,不能有中文)
如果 有 Y/n 的选项 选 Y ; 如果没有就略过。
5. 进入选择界面 ,选最下面 M开头那项,后续可以自定义(少装很多乱七八糟的东西)
6. 回车键,后选具体功能
注意: 空格是选择 ,选好了后再回车。
7. 选vue版本,这里已2.0做例子(也可以选3.0)
8. 选路由模式,建议选 n
9.选预定义样式模式,建议 less
10. 选择依赖文件,建议 package.json .
11 . 最后一个选项是否需要保存当前配置,在以后的项目中可快速构建,这个我建议 n
12 . 回车后 开始下载
完成后如下:
13 :按上面蓝色部分的提示 ;在 cmd 中键入: cd web3207 (web3207 是你自己建的目录)
14: 在目录中建立vue.config.js,方便对vue工程进行配置。
这里提供一个配置文件 vue.config.js 对应的网址给大家配置参考 | Vue CLI
15. 建议在 cmd 中键入 : npm install --save-dev jquery
(jquery 虽然老了,但是还有不少好东西,不要全丢了)
16.注意 vue.config.js 中的节点 port:80 这个表示工程访问的端口 ,我一般改 7000
17. 都准备完后就可以键入 npm run server
18. 打开浏览器(建议火狐或谷歌),地址栏输入 http://127.0.0.1:(自己配的端口号)就可以了