Vue-CLI
这相当于一个编译程序,将vue文件编译成html
安装要求: 有 node.js 环境
因为Vue-cli其实是建立在node环境下运行的,简单理解就是用以前的前后端混合生成页面的方式来生成网页,所以要运行cli就需要Node.js这个后端软件.
安装Node.js
Tip: 本人使用的是 win10x64位系统
打开 Node.js官网
安装使用默认选项即可,大佬们根据需求安装
安装完成可在cmd中使用node -v 查看 node.js 版本 就可以了
安装 vue-cli
由于npm使用的是国外源(就是国外服务器)下载会很慢,所以先安装了
cnmp使用淘宝源
在控制台中输入以下命令npm install -g cnpm --registry=https://registry.npm.taobao.org
等待安装完成
在 vue cli 网址中找到安装命令npm install -g @vue/cli
复制该命令 在控制台中执行 等待安装完成
当安装完成 在 控制台 中能查询到 cli信息就可以了
部署项目
使用 控制台 打开项目目录(按shift+鼠标右键可以直接打开控制台)
在打开的 控制台 中输入 vue ui 来创建项目(这里用的是可视化界面创建的,喜欢命令行创建的输入 vue create my-project 即可,注:命令行方式中提示都是英文 )
输入后稍等,浏览器会自动弹出管理页面(此时不要关闭 控制台 否则网页就失去连接了)
这样就创建完成一个项目了
简单的配置和使用
配置引入文件的路径和保存的文件夹名
开发时浏览的页面
当运行时可以在输出中直接打开页面
编译生成文件
如果在创建项目中浏览器一直显示在创建中,可以尝试重新创建
当你想要再次打开项目时可以使用以下方法
1.在控制台中任意路径输入 vue ui 即可弹出项目管理器
2.在项目 根目录 打开控制台 输入 npm run serve 回车
期待下次分享!