Weex 环境搭建及配置

命令行创建Weex项目及idea下配置

命令行创建weex

首先打开命令行(window)或者终端(Mac)必须先安装Node.js,然后全局安装 weex-toolkit 假设这些你已经完成在输入这行命令安装weex所需weex的环境,npm install weex-toolkit -g,接着就可以创建项目weex create awesome-app 这样就在跟目录创建了一个名为 awesome-app的项目到这里基本上就完成了,你也可以通过命令来安装npm install和启动项目npm start体验一下,这些步骤官网都有还有一些其他的我就不重复说了。

这里先提供一个App下载地址:http://weex.apache.org/cn/tools/playground.html
干嘛用的?,如果你是通过命令行来启动这个项目你会看见网页右侧有个二维码,这里的App下载是官方提供的,下载安装后使用里面的二维码扫描 ,来扫描这个二维码可以看到页面在手机上渲染的真实效果。

假设上面不是你要找和看的重点那么接下来就是了:
首先打开idea,选择打开你的项目

Weex 环境搭建及配置
Weex 环境搭建及配置

idea配置

首先如果你打开了项目,先配置编译环境,服务器和dev,两个步骤相差无几
Weex 环境搭建及配置
点击这个我们先来配置serve,点击
Weex 环境搭建及配置
点击+号添加npm
Weex 环境搭建及配置
Weex 环境搭建及配置
配置服务器
Weex 环境搭建及配置
配置dev(及时编译),用途就是当你按保存的时候会重新编译一边src目录下所有文件,和更新dist目录下.js文件
Weex 环境搭建及配置
这样idea下weex项目基本配置完成了先启动serve会在网页看见一个窗口,然后在启动dev就可以开始你的码代码之路了,用官方app扫描之后,每次写完一个模块点击保存就会看见页面在自动刷新。这样很方便
serve启动后:
Weex 环境搭建及配置
这里横线的是本地服务器地址,然后是dev,启动之后你会在根目录看见一个dist的文件夹这里就是你用weex写的代码编译成js之后存放的路径:
Weex 环境搭建及配置
每次保存之后这里都会重新编译src目录下的文件到dist并且这里会更新是不是很方便?
如果有错欢迎指正,我也是第一次开始接触weex,把学习weex遇见的问题和经验写在这上面。下一篇会写关于weex在Android遇见的坑