Vue项目运行过程及其遇到的问题

node.js安装

从node.js官网上下载合适的版本，之后一直下一步进行安装。

                             

安装好node后可以测试一下，是否安装成功

命令：node -v

命令：npm -v

                               

安装淘宝镜像cnpm

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

关于为什么要安cnpm:

因为npm下载安装插件是要从国外的服务器下载，会受到网络等因素的影响，cnpm是淘宝镜像。来自官网：“这是一个完整 npmjs.org 镜像，你可以用此代替官方版本(只读)，同步频率目前为 10分钟 一次以保证尽量与官方服务同步。”

查看是否安装成功

                 

安装webpack

命令：npm install webpack -g

                                                         忘记截图了~假装我是图.jpg

安装vue-cli（脚手架）

使用cnpm来安装，npm安装慢，有可能会卡在那里

命令：cnpm install vue-cli -g

  

运行vue项目

假设你的项目名叫：firstVue

命令：vue init webpack firstVue

               

安装完成之后项目里会出现一个node_modules的文件夹，如果安装失败，可以查询log，查看具体是什么样的错误。

PS:可以尝试把node_modules删掉，重新初始化项目，这个对我来说是个百试百灵的办法，如果遇到了初始化失败的问题，各位都可以试试将node_modules删掉

运行项目：

命令：npm run dev

 

项目运行成功后，浏览器会自动打开localhost:8080（假如浏览器没有自动打开，可以手动输入）。