40 Star 89 Fork 26

无鞘之刃 / wxdad

加入 Gitee
与超过 1200万 开发者一起发现、参与优秀开源项目,私有仓库也完全免费 :)
免费加入
克隆/下载
README.md 3.81 KB
一键复制 编辑 原始数据 按行查看 历史
无鞘之刃 提交于 2016-12-01 13:32 . 更新 README.md
                   _           _
__      ____  ____| | __ _  __| |
\ \ /\ / /\ \/ / _` |/ _` |/ _` |
 \ V  V /  >  < (_| | (_| | (_| |
  \_/\_/  /_/\_\__,_|\__,_|\__,_|
                                 

一、介绍

一款微信小程序脚手架工具,帮助你快速开发微信小程序应用。

目前有两个功能:

  1. 快速构建初始项目架构。
  2. 把wxdad语法快速编译成wxml和wxjs文件,帮助开发者急速开发。

二、使用前你必须


  1. 安装nodejs最新版本。
  2. 将node部署到shell/cmd全局变量环境。

三、安装方法


  • 终端下输入:git clone https://git.oschina.net/lisniuse/wxdad.git

四、简易教程(以 Windows 环境为例,其他系统同理)


1):项目初始化:

第一步:在D盘新建一个文件夹名为:wxdemo。
第二步:在wxdemo里新建一个app.json,并且写好微信官方文档中所要求的一些配置项 (如果不清楚可以去看:

http://mp.weixin.qq.com/debug/wxadoc/dev/framework/config.html?t=20161107)

配置内容大概如下:

{
  "pages": [
    "pages/index/index",
    "pages/logs/logs"
  ],
  "window": {
    "navigationBarTitleText": "Demo"
  },
  "tabBar": {
  },
  "networkTimeout": {
    "request": 10000,
    "downloadFile": 10000
  },
  "debug": true
}

其中 pages 数组为必填项,脚手架工具会根据你填写的 pages 路径来自动为你创建页面文件夹以及文件。

第三步:打开命令行输入:node wxdad build "d:\wxdemo\app.json"

输入图片说明

第四步:最后打开微信开发工具,加载刚刚创建好的wxdemo

输入图片说明 输入图片说明

2):为项目动态添加新页面:

原来的配置文件如下:

{
  "pages": [
    "pages/index/index",
    "pages/logs/logs"
  ],
  "window": {
    "navigationBarTitleText": "Demo"
  },
  "tabBar": {
  },
  "networkTimeout": {
    "request": 10000,
    "downloadFile": 10000
  },
  "debug": true
}

新的配置文件如下:

{
  "pages": [
    "pages/index/index",
    "pages/logs/logs",
    "pages/home/hoem"
  ],
  "window": {
    "navigationBarTitleText": "Demo"
  },
  "tabBar": {
  },
  "networkTimeout": {
    "request": 10000,
    "downloadFile": 10000
  },
  "debug": true
}

可以看到在pages数组中新增了一个"pages/home/home"

保存之后,在终端下输入:node wxdad build "d:\wxdemo\app.json" 即可完成新页面的创建和添加,并且不会影响到原来的页面。

3)列表循环语法糖: 打开项目中的index.wxml文件,键入代码:

<view wx:for="{{[https://api.douban.com/v2/movie/top250].subjects}}">
  {{index}}: {{item.title}}
<view>

输入图片说明

保存后,终端输入对文件进行编译: node wxdad compile "d:\wxdemo\app.json" 3输入图片说明

打开开发者工具你将看到:

输入图片说明

更新日志:

0.1.2 : 1.修复若干BUG 2.新增列表渲染语法糖。

0.0.11 : 1.将源代码重新构建成nodejs模块化。 2.全面使用ES6语法编写。

NodeJS
1
https://gitee.com/lisniuse/wxdad.git
git@gitee.com:lisniuse/wxdad.git
lisniuse
wxdad
wxdad
master

搜索帮助