WEEX 是阿里推送的一款基于Node.js,轻量级的移动端跨平台动态性技术解决方案,用于构建原生的速度的跨平台APP.

搭建weex开发环境

node npm 一般都有 自己安装
我主要说一下weex脚手架的安装weex-toolkit
我先在node的执行命令npm install -g weex-toolkit
一直报错,
后来安装淘宝镜像npm install -g cnpm --registry=http://registry.npm.taobao.org

之后再执行cnpm install -g weex-toolkit
才ok,之前在git bash here没有安装成功

之后,根目录其实是没有任何东西的,然后手动在根目录下新建一个文件,命名为list.we,其中 .we 是文件的后缀名,跟vue是很像的,,写一段东西

<template>
  <div class="container">
    <div class="cell">
        <image class="thumb" src="http://t.cn/RGE3AJt"></image>
        <text class="title">JavaScript</text>
    </div>
  </div>
</template>

<style>
  .cell { margin-top: 8; margin-left: 8; flex-direction: row; }
  .thumb { width: 100; height: 100; }
  .title { text-align: center; flex: 1; color: grey; font-size: 25; }
</style>

就这样写就OK,或者还能更简单一点

<template>
  <div>
    <text class="title" onclick="onClickTitle">Hello Weex</text>
  </div>
</template>

<style>
  .title { color: red; }
</style>

<script>
  module.exports = {
    methods: {
      onClickTitle: function (e) {
        console.log(e);
        alert('title clicked.');
      }
    }
  }
</script>

这样就跟vue的结构一样了,有vue的基础的话,学起来会简单一些,
是由三部分组成的.template style script 但是写完了一个demo,得运行吧,在你的根目录下,输入 weex list.we
然后就会弹出

image.png
这才是正确的打开方式,不知道哪一篇文章说是cd list.we 打开的,根本不可能的.
OK了,之后的,看看语法什么的,环境搭建已经完成了

但是已经有脚手架了,还要自己手动建立文件夹,手动建立文件,手动把正确的文件放在正确的文件夹下面,是不是很难受,现在开始真正的技术

现在你在node 初始化一个项目 weex init my-project
切换到你项目目录下 cd my-project
然后安装项目依赖npm install 如果失败了,就换成cnpm install 神奇么,就是这样,嗖一下就安装好了,但是npm 就不行,装好几遍都不行.
截个图

cnpm安装
然后npm run serve 官网上有npm run dev 我试了不行,不知道怎么回事,但是serve是可以的
会出现这个图 运行