浅谈vue.js 从配置环境到打包运行 （初学者适应）
demo实例https://download.csdn.net/download/zxd1314520/10634016
一、首先是配置环境
已经有很多文章写怎么配置环境了，这里我就简写了。
1.进入 vue 官网 下载 64位 安装包
2.安装完成后 配置环境变量
3.基于 Node.js 安装cnpm（淘宝镜像）
npm install -g cnpm --registry=https://registry.npm.taobao.org
$ npm install -g cnpm --registry=https://registry.npm.taobao.org
4、安装Vue
cnpm install vue -g
5.安装vue命令行工具，即vue-cli 脚手架
cnpm install vue-cli -g
6.新项目的创建
（1）切换到一个空目录
mkdir newvues
cd newviews
（2）在当前目录下输入“vue init webpack 项目名称（使用英文）”。
vue init webpack myvue1
cd myvue1
cnpm install （安装依赖包）
cnpm run dev （运行）
我用的是淘宝镜像。cnpm install -----------cnpm run dev开启一个项目
二、布局页面
找到APP.vue作为主通口，引入navigation来进入子页面。这里你需要安装navigation ,不然会报错navigation未定义 cnpm vue-navigation --save.回车后，你会在你的package.json里看到
此时你的navigation就不会出现未定义了；后面安装的axios vue-lazyload安装方法都是一样的；
在main.js里配置
import Navigation from 'vue-navigation'//导航
Vue.use(Navigation, {router})
三、路由
配置页面的时候一定要重定向
不然会导致一开始进入页面是空白页面
三、组件引入
首先一定要在index.js里面引入组件
例如
接着就是实际页面的布局了，样式<style scoped></style>scoped只对当前页面样式产生影响
四、页面布局完成 主要重要的就是跟后台进行数据相互
vue.js数据相互很方便 这也是小生一用上他就爱不释手了 和小程序有异曲同工之处。
例如列表 平时我们用到最多的也就是列表了
（1）v-if v-for 一定要熟练运用。在此也做知道v-show和v-if用法相同不同点在于v-show只是简单的改变display的属性。
v-for 用来循环数据的
v-for="item in listData" 当然你也可以放参数(item,index)后面就是你要显示的那个数据了例如
以上是小生需要显示的东西。
以上你都弄好后，你需要定义和请求数据 在data里定义 listData:[],不然后报错
与后台交互 建议用axios 安装方法上面已讲 不在重复；
listData 还是dateList 或者其他 看你自己怎么定义的 v-for=‘item in listData’还是其他
以上中我用到了一个加载数据在加载中的 加载插件 你可以安装mint-ui 安装方法不再重复
好了 一个简单的页面你就完成了
常用的轮播、小喇叭，等 ，自己可以引入
最后便是打包 同理 cnpm install -----------------cnpm run build 如果打包出现npm未更新等错误 cnpm i cnpm -g一定是全局更新
打包时需要注意修改
将 / 修改为 ./最后打包完成后 不然打包后index.html打包为空白！
你会在你的文件中看到
以上如遇问题 可以与小生一同讨论额!
请多指教