借助node，搭建vue环境
要使用vuejs来开发，首先要有环境，这个环境需要借助于nodejs，所以要先安装node，需要借助于node里面的npm来安装.
vue.png
1.先下载nodejs安装包
在网上可以搜索到此安装包，直接下载就好了
安装nodejs成功后显示的nodejs文件夹
（1）输入node -v命令行就可以显示node版本（用cmd来输入）
Paste_Image.png
输入此命令，为了允许npm在cmd中输入运行
（2）输入webpack命令行，安装webpack
Paste_Image.png
（3）验证全局vue-cli脚手架是否安装成功
Paste_Image.png
补充：
1)需要注意的(npm也是需要在cmd里输入，nodejs编辑器只是编辑一些js)
Paste_Image.png
解决方法：
Paste_Image.png
2)还需要安装git和sdk，还有其他一些
(由于之前本人安装IDE开发软件时已安装了git和sdk，所以可以这步忽略)
3）注意：当出现这个cnpm报错（需要安装淘宝镜像）
解决方法
Paste_Image.png
（4）安装淘宝镜像，这才使cnpm不报错，输入cnpm -v查看版本
Paste_Image.png
（5）往下就是创建vue项目
Paste_Image.png
例子
Paste_Image.png
(6)需要在本地电脑中配置变量：用户变量和系统变量都需要编辑（找到nodejs的安装路径）
Paste_Image.png
(7)输入cnpm install,若此运行不成功，就需要安装淘宝镜像先，再运行命令，运行成功命令，这时项目文件夹里会自动生成node_modules
Paste_Image.png
Paste_Image.png
注意：可能有时安装cnpm install没成功，就安装npm install,或者因为有时可能安装的node_modules出错了，需要删除掉再重新输命令来安装
(8)最后运行npm run dev，注意若是报错，报错信息说明需要升级
Paste_Image.png
(9)输入cnpm install -g npm版本升级
Paste_Image.png
(10)最后输入npm run dev就成功显示端口号为http://localhost:8080
Paste_Image.png
index.js文件中有显示的dev，端口为8080
Paste_Image.png
(11)在浏览器中输入localhost:8080/#/运行了app.vue文件
Paste_Image.png
Paste_Image.png
最后补充说明：
很多人可能会疑惑vuejs不是像jquery插件一样可以直接引入vuejs插件后，然后嵌入在html中写小demo吗？为什么还需要搭建vue环境，其实搭建vue环境后，不用引入插件，直接写.vue后缀文件，运行此文件就可以显示小demo效果。
本文作者lilyping
越努力，越幸运
原文链接：https://www.jianshu.com/u/3908e601f4ec
微信公众号：BestLilyPing
github:https://github.com/lilyping
Demos源码地址：https://github.com/lilyping
