搭建Vue 环境
1 下载 node.js
node.js 中文网 https://nodejs.org/zh-cn/cn/ 下载合适的安装包
2 配置环境 (安装时系统自动配置环境变量)
- 进入系统环境变量界面
- 选择系统变量 path 点击新建
- 查看是否有node.js 的安装路径
3 查看版本
- 查看 node 版本命令:node -v
- 查看 npm 版本命令 npm – v
4 安装淘宝镜像,有利于加快下载速度
npm install -g cnpm --registry=https://registry.npm.taobao.org
检测 cnpm -v
5 下载vue-cli (vue脚手架),用于搭建vue
使用 npm 下载:-g 表示全局安装npm install -g @vue/cli使用 cnpm 下载速度会更快一点cnpm install -g @vue/cli
检查版本 vue –version 或者 vue -V
6 现在即可创建vue项目了
1 第一种方式 使用命令行界面
进入你需要保存vue文件的文件夹,在目录输入 cmd ,或者直接打开命令行界面 cd 到保存vue文件的文件夹。
输入 vue create vue项目名 比如:
vue create test
选择创建项目模板 这里我们选择自定义 按 上下方向键 切换版本,选中第三个选项 回车
这里是选择项目初始化需要的模块 这里可以根据需要选择,我们一般需要
Eable Router Vuex
按 空格键 选择 选择好后回车即可
选择初始化 vue版本 我们选 3.x 回车
路由器使用历史模式” />
最后一个也选 输入 n 回车 后项目开始初始化
5.初始化完毕后 开启项目 分别复制弹出的代码 运行项目
打开网址 查看自己的vue项目
2 网页方式创建 vue项目
在 命令行界面 输入 vue ui
机会打开网页 具体操作与以差不多,可以自行尝试
一些用用的指令:
重新更新模块npm install查看当前目录下安装的node包npm list引入 cnpmnpm install -g cnpm --registry=https://registry.npm.taobao.org运行项目npm run serve打包项目npm run build安装vue 3 脚手架 vue-clinpm install -g @vue/cli安装 vue 2j脚手架 npm install -g vue-cli卸载 vue-clinpm uninstall -g vue-cli引入 axiosnpm install axios --save引入 qsnpm install qs--save引入 jquerynpm install jquery --save;引入 bootstrapnpm install bootstrap --save查找 vue路径where vue