博客
关于我
强烈建议你试试无所不能的chatGPT,快点击我
vue-cli教程(一) 环境搭建
阅读量:7065 次
发布时间:2019-06-28

本文共 1015 字,大约阅读时间需要 3 分钟。

hot3.png

搭建环境的教程网上很多,简单记录下

环境搭建:

1.安装nodejs和npm 略

2.安装cnpm: npm install -g cnpm --registry=

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 :当前组件已被删除,清空相关内容

转载于:https://my.oschina.net/u/2528821/blog/1540030

你可能感兴趣的文章
面向对象如何编写
查看>>
「视频直播技术详解」系列之二:处理
查看>>
zw版【转发·台湾nvp系列Delphi例程】HALCON SetLineStyle1
查看>>
Bzoj4710 [Jsoi2011]分特产
查看>>
pat甲级题目1001 A+B Format详解
查看>>
电话拨号示例
查看>>
day12-迭代器
查看>>
HTML5 <script>元素async,defer异步加载
查看>>
poj2299--归并排序求解逆序对
查看>>
About Common Crypto
查看>>
c/c++关键字分类:
查看>>
二十六、MySQL 临时表
查看>>
haskell基本语法
查看>>
windbg*****************************TBD
查看>>
PHP 邮箱操作的Action
查看>>
UVA Rails(stl-stack)
查看>>
Leetcode名企之路
查看>>
JAVA 8 Streams
查看>>
weka安装
查看>>
设计模式(十一)享元模式
查看>>