vue-cli教程(一) 环境搭建

搭建环境的教程网上不少，简单记录下

环境搭建：

1.安装nodejs和npm 略

2.安装cnpm： npm install -g cnpm --registry=https://registry.npm.taobao.org

3.安装vue-cli : cnpm install -g vue-cli 

4.建立项目：vue init webpack testvue

    会有对话框 除了 Install vue-router? (Y/n)  选择Y ，其余的暂时都选择 n 或者默认（暂时没明白，先不添加了）

5. 执行：

    cd testvue 

    cnpm install （虽然有些依赖下不到，可是还能将就着用）

6. npm run dev (生成好了以后若是在浏览器看到welcome页面 ,算搭建成功了)

7.若是初学者像我好奇，应该怎么生成静态文件，部署，运行 npm run build

       会生成 dist 文件夹，而后将dist文件夹放在相似于 tomcat ,apache,nginx的工做目录下就能够在浏览器上正常访问了，初次访问会出现js没法加载，就 在 config/index.js中

assetsPublicPath: './',   //这个要加上 . 将绝对路径改为相对路径

8.vue的经常使用函数：

        //数据

        data:function(){

                return {  message：“参数”

                               }

         }

        //方法

        methods:{

                add:function(){}  ,

        }，

        //监听数据，须要在data和props里定义

        watch:{

                message:function(newVal,oldVal){}

        }

        //计算属性，不能够在data和props定义

        computed:{

            newMessage:function(){}

         }

9.生命周期函数（vue-2）：

beforecreate : 举个栗子：能够在这加个loading事件
created ：在这结束loading，还作一些初始化，实现函数自执行
mounted ： 在这发起后端请求，拿回数据，配合路由钩子作一些事情

beforeUpdate：数据变化，页面更新以前调用

updated：页面更新以后调用
beforeDestory： 你确认删除XX吗？

destoryed ：当前组件已被删除，清空相关内容