如何启动一个vue.js的前端项目

1、安装node.js

用以下命令验证node是否安装成功，若安装成功，则出现版本号

node -v
npm -v

由于npm镜像在国内速度偏慢，所以通常使用淘宝的npm镜像。

安装成功后,在cmd命令窗口使用如下命令安装npm的国内镜像cnmp

npm install -g cnpm --registry=http://registry.npm.taobao.org

安装完成之后,就可以用cnpm代替npm来安装依赖包

//老版本
cnpm install -g vue-cli
//新版本
npm install -g @vue/cli

//安装新版需先卸载旧版本
npm uninstall vue-cli -g

装完运行环境和构建工具后,就开始使用vue-cli来构建项目。

命令窗口中使用cd 到要构建的项目目录中，

然后需要输入命令：vue init webpack frontend (这里命令的意思是初始化一个项目，项目名称是frontend，其中webpack是构建工具，也就是整个项目时基于webpack的)

运行命令初始化的时候会让用户输入几个基本的选项，如项目名称、描述、作者等信息，可以直接回车默认就可以了。

项目初始化完成后,在项目目录下使用如下命令安装项目所需依赖:

cd到项目目录中去，然后输入*cnpm install *等待安装，安装中会出现警告信息，有的会出现栈溢出等错误，我就是在这里遇到了，一般第一次安装没事，如果安装过的，可以卸载了在重新安装

vue-cli-service serve

启动命令需要根据项目的package.json文件确定，默认项目可以直接用run或者dev启动。

启动成功：