首先,安装vue-cli需要安装node.js,需要使用其中的npm命令
node.js官网 : https://nodejs.org/
傻瓜式安装之后 在命令行中输入 npm -v 若是能得到版本号则说明npm安装成功接着安装 vue-cli ,在命令行中输入
npm install -g vue-cli
即可全局安装 vue-cli,此过程需要一定的时间
若是觉得npm下载太慢可以选择淘宝镜像 cnpm 进行下载
npm config set registry https://registry.npm.taobao.org
验证方法
npm config get registry
若是命令行出现了淘宝镜像的地址,则说明安装成功
https://registry.npm.taobao.org
下载完成之后可以使用 cnpm 代替 npm 其他不变,下载会快一些
接下来就是构建项目
找一个文件夹作为项目的工作区(workspace) 然后在命令行中找到这个文件夹 (快捷方法:进入文件夹之后 shift + 鼠标右键 -> 在此处打开命令行 此方法在Win8 和 Win7 上测试可用 Win10 不清楚),执行命令
vue init webpack 你的项目名称
之后会有一系列的选择,基本一直回车就可以了
值得注意的是会让你选择是否 install vue-router 这个是vue路由组件,绝大部分情况会需要这个,最好选yes。
后面还有问需要测试文件的,可选可不选,如果没用到就可以不选,选了不用也没啥影响
在一段漫长的等待之后,项目就构建完成了,这个时候命令行进入项目根目录下,执行
npm install
安装一些依赖,虽然不知道有啥用,但是貌似不执行这个的话启动会慢,还会出现一些奇怪的问题,而且从网上直接扒源码之后也需要执行这个命令一次才可以正常打开
命令执行完毕之后就可以启动了,在项目的根目录下打开命令行,执行
npm run dev
等待一段时间启动,启动完成之后就可以看到打开vue欢迎页的地址,一般会是 http://localhost:8080/ 如果8080端口被占用,这个可能会打开 8081 这样的其他端口。
启动成功之后访问地址即可看到 vue 的欢迎界面,说明启动成功
后端菜鸟快速使用前端vue框架笔记,一切为能用服务