受到前同事安利去尝试了一下weex，对比react-native从安装配置上来说要简单一些，但是文档真是少的可怜，这难道又是一个阿里的kpi项目？简单记录一下昨天在rmbp上的折腾。
- 安装homebrew
/usr/bin/ruby -e "$(curl -fsSL https://raw.githubusercontent.com/Homebrew/install/master/install)"
- 用homebrew去安装node
brew install node
安装完成之后就拥有了node和npm。
- 用npm去安装weex
npm install -g weex-toolkit
到这里weex安装完成，可以愉快地用weex玩耍了。
第一个weex项目
cd ~/Documents
weex init HelloWeex #创建HelloWeex工程
cd HelloWeex
npm install #安装项目依赖
npm run dev #开启watch
npm run serve #开启静态服务器
在以上命令行运行完之后就可以进入http://localhost:8080/index.html看到weex欢迎界面，如下所示：
image.png
上图是在里面内嵌了一个video内置组件，src/foo.vue代码如下：
<template>
<div>
<video class="video" :src="src" controls
@start="onstart" @pause="onpause" @finish="onfinish" @fail="onfail"></video>
<text class="info">state: {{state}}</text>
</div>
</template>
<style scoped>
.video {
width: 630px;
height: 350px;
margin-top: 60px;
margin-left: 60px;
}
.info {
margin-top: 40px;
font-size: 40px;
text-align: center;
}
</style>
<script>
export default {
data () {
return {
state: '----',
src:'http://flv2.bn.netease.com/videolib3/1611/01/XGqSL5981/SD/XGqSL5981-mobile.mp4'
}
},
methods:{
onstart (event) {
this.state = 'onstart'
},
onpause (event) {
this.state = 'onpause'
},
onfinish (event) {
this.state = 'onfinish'
},
onfail (event) {
this.state = 'onfinish'
}
}
}
</script>
weex官方文档还是偏少，具体项目实战还得慢慢自己摸索了~
