{"id":13487203,"url":"https://github.com/haojy/weact","last_synced_at":"2025-03-27T21:32:06.032Z","repository":{"id":57397206,"uuid":"115813359","full_name":"haojy/weact","owner":"haojy","description":"weact 用JSX快速开发小程序","archived":false,"fork":false,"pushed_at":"2018-02-18T00:04:43.000Z","size":111,"stargazers_count":86,"open_issues_count":4,"forks_count":12,"subscribers_count":1,"default_branch":"master","last_synced_at":"2025-03-18T17:52:42.210Z","etag":null,"topics":["jsx","miniprogram","react","weapp","wxapp"],"latest_commit_sha":null,"homepage":null,"language":"JavaScript","has_issues":true,"has_wiki":null,"has_pages":null,"mirror_url":null,"source_name":null,"license":"mit","status":null,"scm":"git","pull_requests_enabled":true,"icon_url":"https://github.com/haojy.png","metadata":{"files":{"readme":"README.md","changelog":"CHANGELOG.md","contributing":null,"funding":null,"license":"LICENSE","code_of_conduct":null,"threat_model":null,"audit":null,"citation":null,"codeowners":null,"security":null,"support":null}},"created_at":"2017-12-30T17:55:02.000Z","updated_at":"2025-03-04T14:51:43.000Z","dependencies_parsed_at":"2022-09-07T09:21:59.965Z","dependency_job_id":null,"html_url":"https://github.com/haojy/weact","commit_stats":null,"previous_names":[],"tags_count":7,"template":false,"template_full_name":null,"repository_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/haojy%2Fweact","tags_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/haojy%2Fweact/tags","releases_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/haojy%2Fweact/releases","manifests_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/haojy%2Fweact/manifests","owner_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners/haojy","download_url":"https://codeload.github.com/haojy/weact/tar.gz/refs/heads/master","host":{"name":"GitHub","url":"https://github.com","kind":"github","repositories_count":245927362,"owners_count":20695221,"icon_url":"https://github.com/github.png","version":null,"created_at":"2022-05-30T11:31:42.601Z","updated_at":"2022-07-04T15:15:14.044Z","host_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub","repositories_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories","repository_names_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repository_names","owners_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners"}},"keywords":["jsx","miniprogram","react","weapp","wxapp"],"created_at":"2024-07-31T18:00:56.563Z","updated_at":"2025-03-27T21:32:05.492Z","avatar_url":"https://github.com/haojy.png","language":"JavaScript","funding_links":[],"categories":["工具"],"sub_categories":[],"readme":"# weact 用JSX快速开发小程序\n\n[![travis-ci](https://travis-ci.org/haojy/weact.svg?branch=master)](https://travis-ci.org/haojy/weact)\n[![Code coverage](https://codecov.io/gh/haojy/weact/branch/master/graph/badge.svg)](https://codecov.io/github/haojy/weact?branch=master\")\n[![Dependence](https://david-dm.org/haojy/weact/status.svg)](https://david-dm.org/haojy/weact)\n[![License](https://img.shields.io/npm/l/weact-cli.svg)](https://github.com/haojy/weact/blob/master/LICENSE)\n\n\nweact实现了用JSX和ES6/7来开发小程序，你可以在一个jsx文件中编写页面或组件，并把关联的JSX代码和引用包编译成小程序代码，然后在*小程序开发者工具*中调试代码。因为使用了JSX和ES标准语法，你可以轻松地把已有的JSX代码重构成小程序，当然你也可以使用喜欢的语法高亮，语法检查器等工具。\n\n最新版本[![Version](https://img.shields.io/npm/v/weact-cli.svg)](https://github.com/haojy/weact/blob/master/CHANGELOG.md)支持\n\n* JSX，ES6/7标准语法\n* 单文件开发小程序模块\n* 引用NPM包\n* async/await\n* Promise化微信小程序/小游戏API\n* 导入CSS/Sass/Less样式文件\n\n下个小版本将支持\n* 用React方式开发小程序组件\n\n\u003e 安装包*./node_modules/weact-cli/examples/* 有使用weact的例子，也可以从https://github.com/haojy/weact-startup获取例子。\n## 快速上手\n  - [安装](#安装)\n  - [JSX小程序](#jsx小程序)\n  - [生成小程序](#生成小程序)\n## 教程\n  - [从JSX到WXML](#从jsx到wxml)\n  - [App.jsx](#appjsx)\n  - [Page.jsx](#pagejsx)\n  - [导入样式](#importStyle)\n  - [模版==函数式Component](#模版函数式component)\n  - [组件](#组件)\n    - [组件关系](#组件关系)\n    - [React组件 (TODO)](#React组件)\n  - [引用模块](#引用模块)\n  - [Promise和async/await](#promise和asyncawait)\n  - [Promise化微信小程序/小游戏API](#promise化微信小程序小游戏api)\n  - [命令行用法](#命令行用法)\n\n\n### 安装\n---\n\n在项目里安装*weact-cli*,\n```bash\nnpm install -D weact-cli\nnpx weact\n```\n\n### JSX小程序\n---\n\n让我们开始写一个Hello world的小程序，只需要两个文件：app.jsx，index.jsx, 通常页面代码会被放在`./pages`目录下，\n```\nsrc/\n├── app.jsx\n└── pages\n    └── index.jsx\n```\n\nweact只把app.jsx作为目标文件，也就是说所有需要的页面需要在app.jsx中被import进来。在这个例子中，只有一个页面index可以import。我们还需要继承`weact.App`来声明小程序的app, 这里只export一个空的类，[ App.jsx ](#App.jsx)会详细说明怎么定义app，\n```javascript\n// src/app.jsx\nimport { App } from 'weact'\nimport './pages/index.jsx' // app应用的页面，需要import\n\nexport default class extends App {\n}\n```\n\n和app一样，所有页面要继承`weact.Page`，并被export才可以。与应用不同的是，页面有`render()`方法来定义显示部分，在render方法里返回JSX标签，在语法上这和React Component的render相同。weact会根据render方法里返回的标签，自动编译出WXML文件，[ 从JSX到WXML ](#从JSX到WXML)会说明如何用JSX写出符合WXML定义的标签。`weact.WXSS`利用ES6字符串模版的能力，可以在jsx中声明符合WXSS语法的样式，这样样式就会被weact编译成对应的WXSS文件。\n\n```javascript\n// src/pages/index.jsx\nimport { Page, WXSS } from 'weact'\n\nWXSS`\n.hi {\n  color: blue;\n}\n`\nexport default class extends Page {\n  render() {\n    return (\n      \u003cview class=\"hi\"\u003e\n        Hello World!\n      \u003c/view\u003e\n    )\n  }\n}\n```\n\n这样，一个基于JSX的小程序就完成了。\n\u003e 在[ 实战JSX开发小程序 ](https://github.com/haojy/weact-startup) 中有更多的例子可以参考。\n\n### 生成小程序\n---\n\n上面的代码都存放在`./src`目录下，然后执行\n```bash\nnpx weact ./src # 等同于 weact ./src/app.jsx ./dist\n```\n\n在当前目录下会生成`./dist`目录，里面全是根据jsx文件编译出的小程序代码，\n```\ndist/\n├── app.js\n├── app.json\n└── pages\n    └── index\n        ├── index.js\n        ├── index.wxml\n        └── index.wxss\n```\n在*微信开发者工具*添加项目，项目目录设置成`./dist`, 然后就可以在模拟器中看到运行结果了。\n\n### 从JSX到WXML\n---\n\nweact可以在语法上把JSX编译成WXML，下面列表给出两种语言的在语法上的对应关系。\n\n语法 | JSX | WXML\n----|-----|-----\n数据绑定 | `\u003cview\u003e{message}\u003c/view\u003e` | `\u003cview\u003e {{ message }} \u003c/view\u003e`\n属性 | ``\u003cview id={`${prefix}-item}`\u003ehi\u003c/view\u003e`` | `\u003cview id=\"{{prefix}}-item\"\u003ehi\u003c/view\u003e`\n关键字 false | `\u003cview checked={false}\u003ehi\u003c/view\u003e` | `\u003cview checked=\"{{false}}\"\u003ehi\u003c/view\u003e`\n关键字 | `\u003cview checked\u003ehi\u003c/view\u003e` | `\u003cview checked=\"{{true}}\"\u003ehi\u003c/view\u003e` \n三元运算 | `\u003cview hidden={flag ? true: false}\u003ehi\u003c/view\u003e` | `\u003cview hidden=\"{{flag ? true : false}}\"\u003ehi\u003c/view\u003e`\n算数运算 | `\u003cview\u003e{a + b} + {c} + d\u003c/view\u003e` | `\u003cview\u003e{{a + b}} + {{c}} + d\u003c/view\u003e`\n逻辑判断 | `\u003cview if={length \u003e 5}\u003ehi\u003c/view\u003e` | `\u003cview wx:if=\"{{length \u003e 5}}\"\u003ehi\u003c/view\u003e`\n字符串运算 | `\u003cview\u003e{\"hello \" + name}\u003c/view\u003e` | `\u003cview\u003e{{\"hello \" + name}}\u003c/view\u003e`\n数组 | `\u003cview for={[zero, 1, 2, 3, 4]}\u003e`\u003cbr/\u003e\u0026nbsp;\u0026nbsp;`{item}`\u003cbr/\u003e`\u003c/view\u003e` | `\u003cview wx:for=\"{{[zero, 1, 2, 3, 4]}}\"\u003e`\u003cbr/\u003e\u0026nbsp;\u0026nbsp;`{{item}}`\u003cbr/\u003e` \u003c/view\u003e`\n对象 | `\u003cview data={{ foo: 0, bar: 1 }}\u003ehi\u003c/view\u003e` | `\u003cview data=\"{{ foo: 0, bar: 1 }}\"\u003ehi\u003c/view\u003e`\n数据访问 | `\u003cview\u003e{object.key} {array[0]}\u003c/view\u003e` | `\u003cview\u003e{{object.key}} {{array[0]}}\u003c/view\u003e`\nfor 循环 | `\u003cview for={array} key=\"message\"\u003e`\u003cbr/\u003e\u0026nbsp;\u0026nbsp;`{index}:{item.message}`\u003cbr/\u003e`\u003c/view\u003e` | `\u003cview wx:for=\"{{array}}\" wx:key=\"message\"\u003e`\u003cbr/\u003e\u0026nbsp;\u0026nbsp;`{{index}}:{{item.message}}`\u003cbr/\u003e`\u003c/view\u003e`\nif 条件 | `\u003cview if={condition}\u003ehi\u003c/view\u003e` | `\u003cview wx:if=\"{{condition}}\"\u003ehi\u003c/view\u003e`\nif else | `\u003cview if={x \u003e 5}\u003e1\u003c/view\u003e`\u003cbr/\u003e`\u003cview elif={x \u003e 2}\u003e2\u003c/view\u003e`\u003cbr/\u003e`\u003cview else\u003e3\u003c/view\u003e` | `\u003cview wx:if=\"{{x \u003e 5}}\"\u003e1\u003c/view\u003e`\u003cbr/\u003e`\u003cview wx:elif=\"{{x \u003e 2}}\"\u003e2\u003c/view\u003e`\u003cbr/\u003e`\u003cview wx:else\u003e3\u003c/view\u003e`\nblock 条件 | `\u003cblock if={true}\u003e`\u003cbr/\u003e\u0026nbsp;\u0026nbsp;`\u003cview\u003e 1 \u003c/view\u003e`\u003cbr/\u003e` \u003c/block\u003e` | `\u003cblock wx:if=\"{{true}}\"\u003e`\u003cbr/\u003e\u0026nbsp;\u0026nbsp;`\u003cview\u003e 1 \u003c/view\u003e`\u003cbr/\u003e` \u003c/block\u003e`\nblock 循环 | `\u003cblock for={[1, 2, 3]}\u003e`\u003cbr/\u003e\u0026nbsp;\u0026nbsp;`\u003cview\u003e{index}:{item}\u003c/view\u003e`\u003cbr/\u003e`\u003c/block\u003e` | `\u003cblock wx:for=\"{{[1, 2, 3]}}\"\u003e`\u003cbr/\u003e\u0026nbsp;\u0026nbsp;`\u003cview\u003e{{index}}:{{item}}\u003c/view\u003e`\u003cbr/\u003e`\u003c/block\u003e`\n事件处理 | `\u003cbutton bindtap={handleTap}\u003eNext\u003c/button\u003e`| `\u003cbutton bindtap=\"handleTap\"\u003eNext\u003c/button\u003e`\nonXXX == bindxxx  | `\u003cbutton onTap={this.handleTap}\u003eNext\u003c/button\u003e` | `\u003cbutton bindtap=\"handleTap\"\u003eNext\u003c/button\u003e`\n\n### App.jsx\n---\n\n小程序在json文件中进行全局配置，用JSX把这些配置写成App的类属性，对比参考[ 小程序配置 ](https://mp.weixin.qq.com/debug/wxadoc/dev/framework/config.html)。同样，App的[ 生命周期函数，自定义公共变量，自定义公共函数等属性 ](https://mp.weixin.qq.com/debug/wxadoc/dev/framework/app-service/app.html)都可以写成类属性。weact把app.jsx编译成对应的app.json，app.js, app.wxss。\n\n```javascript\nexport default class extends App {\n\n  debug = true\n\n  window = {\n    navigationBarTitleText: '你好，小程序',\n    navigationBarTextStyle: 'black',\n    navigationBarBackgroundColor: '#f4f5f6',\n    backgroundColor: '#f4f5f6',\n  }\n\n  tabBar = {\n    color: '#333333',\n    backgroundColor: '#ffffff',\n    list: [\n      {\n        pagePath: 'pages/index/index', // 编译后js路径\n        text: '�',\n      },\n      {\n        pagePath: 'pages/page1/page1',\n        text: 'Page 1',\n      },\n    ],\n  }\n\n  myData = '自定义公共变量',\n\n  hello() { return '自定义公共函数' }\n\n  // 生命周期\b函数\n  onLaunch() { console.log('app: hello world') }\n  onShow() { console.log('app: yes, I am') }\n  onHide() { console.log('app: just minutes') }\n  onError() { console.log('app: woops') }\n}\n```\n\n### Page.jsx\n---\n\n类似App.jsx，页面的[ 生命周期函数和其他属性 ](https://mp.weixin.qq.com/debug/wxadoc/dev/framework/app-service/page.html)也写成Page的类属性。除此之外，\n- Page的`render()`函数定义页面显示，\n- 标签使用参考[小程序基础组件](https://mp.weixin.qq.com/debug/wxadoc/dev/component/)\n- 组件的事件处理函数在Page中直接定义类函数\n\n```javascript\nexport default class extends Page {\n\n  data = {\n    // 页面数据\n  }\n\n  myData = '自定义公共变量',\n\n  handleTap() { console.log('自定义公共函数') }\n\n  // 生命周期函数\n  onLoad() { console.log('page index: loading...') }\n  onShow() { console.log('page index: yes, I am') }\n  onReady() { console.log('page index: I am ready now') }\n  onHide() { console.log('page index: just minutes') }\n  onUnload() { console.log('page index: bye...') }\n  onReachBottom() { console.log('page index: we get to the most bottom') }\n  onPullDownRefresh() { console.log('page index: pull down') }\n  onPageScroll() { console.log('page index: scrolling...') }\n  onShareAppMessage() { console.log('page index: share this') }\n\n  render() {\n    return (\n      \u003cview\u003e\n        Hello World!\n        \u003cbutton onTap={this.handleTap}\u003e下一页\u003c/button\u003e\n        \u003cnavigator url=\"/pages/page1/page1\"\u003e跳转到Page 1\u003c/navigator\u003e\n        \u003cnavigator url=\"/pages/page2/page2\"\u003e跳转到Page 2\u003c/navigator\u003e\n      \u003c/view\u003e\n    )\n  }\n}\n\n```\n\n### 导入样式\n\nweact支持在JSX文件中直接引用CSS/SASS/SCSS/LESS文件，所有引用的文件会被编译成单个样式文件*app.wxss*。根据具体使用的样式文件类型，安装对应的编译器\n\n样式类型 | 安装包\n----------|-------------\n*css* | 内置，无需安装\n*sass/scss* |`yarn add node-sass --dev`\n*less* | `yarn add less --dev`\n*stylus* | `yarn add stylus --dev`\n\n比如，\n```\nimport './index.css'\nimport './page1.scss'du y\nimport './page2.less'\n```\n支持在单个文件中引用多个不同样式文件，只要安装好对应的编译器。\n\n### 模版==函数式Component\n---\n\n小程序的模版可以理解成，没有状态的函数式Component。weact会把返回JSX标签的函数编译成模版，使用这类组件时，只要确保import的名字和定义的一样就可以。\n\n```javascript\n// src/components/flex.jsx\nexport default function flex({\n  direction,\n}) {\n  return (\n    \u003cview\u003e\n      \u003cview class=\"section\"\u003e\n        \u003cview\u003eflex-direction: ${direction}\u003c/view\u003e\n        \u003cview style={`display:flex;flex-direction:${direction};`}\u003e\n          \u003cview class=\"flex-item bc_green\"\u003e1\u003c/view\u003e\n          \u003cview class=\"flex-item bc_red\"\u003e2\u003c/view\u003e\n          \u003cview class=\"flex-item bc_blue\"\u003e3\u003c/view\u003e\n        \u003c/view\u003e\n      \u003c/view\u003e\n    \u003c/view\u003e\n  )\n}\n```\n\n```javascript\n\n// src/pages/index.jsx\nimport { Page } from 'weact'\nimport flex from '../components/flex.jsx'\n\n\nexport default class extends Page {\n  render() {\n    return (\n      \u003cview\u003e\n        \u003cflex direction=\"row\" /\u003e\n        \u003cflex direction=\"column\" /\u003e\n      \u003c/view\u003e\n    )\n  }\n}\n```\n\n### 组件\n---\n\n用weact自定组件更类似写*react Component*，像Page一样显示声明继承Compnent类就可以。组件的属性可以用`propTypes`和`defaultProps`来定义，分别对应着`properties[...].type`和`properties[...].value`。属性类型由`weact.PropTypes`定义如下\n\nPropTypes | 小程序属性类型\n----------|-------------\n*string* | *String*\n*number* | *Number*\n*bool* | *Boolean*\n*object* | *Object*\n*array* | *Array*\n\n在下面的例子里*a*，*b*就是组件属性。如果你了解*react*，你会比较熟悉这种定义Component的方式。 \n另外，自定义的方法和事件响应函数可以直接定义为类属性，weact在编译时把这些函数放在`methods`属性里。\n\n```javascript\nimport { Component, PropTypes } from 'weact'\nexport default class extends Component {\n  static propTypes = {\n    a: PropTypes.string\n    b: PropTypes.bool\n  }\n  static defaultProps = {\n    a: 'world',\n    b: true,\n  }\n  state = {\n    open: true,\n    x: 'hi',\n    item: {\n      index: 0,\n      time: '2016-09-15'\n    }\n  }\n\n  render() {\n    const { a, b } = this.props\n    const { open } = this.state\n    return (\n      \u003cview\u003e\n        \u003cview x={b} y=\"str\"\u003ehi {a} \u003c/view\u003e\n        \u003cview for={[1, 2, 3]} \u003e \u003c/view\u003e\n        \u003cview for={array} for-index=\"i\" for-item=\"node\"\u003e \u003c/view\u003e\n      \u003c/view\u003e\n    )\n  }\n}\n```\n\n#### 组件关系\n\nweact会根据父子组件的引用关系，自动编译出`relations`的定义。来看看下面的例子，父组件parent引用了子组件child。\n\n```javascript\n// ./parent.jsx\nimport { Component, PropTypes } from 'weact'\nimport child from './child.jsx'\nexport default class extends Component {\n  render() {\n    return (\n      \u003cview\u003e\n        父级组件\n        \u003cchild /\u003e\n      \u003c/view\u003e\n    )\n  }\n}\n```\n\n```javascript\n// ./child.jsx\nimport { Component, PropTypes } from 'weact'\nexport default class extends Component {\n  render() {\n    return (\n      \u003cview\u003e\n        子级组件\n      \u003c/view\u003e\n    )\n\n  }\n}\n```\n\nweact编译后在各自的js文件里自动生成关系定义，而不用手动定义。\n```javascript\n// ./parent.js\n  relations: {\n    \"../child/child\": {\n      type: \"child\"\n    }\n  },\n```\n```javascript\n// ./child.js\n  relations: {\n    \"../parent/parent\": {\n      type: \"parent\"\n    }\n  },\n```\n\n#### React组件\n\nTODO\n\n### 引用模块\n---\n\n虽然小程序暂不支持直接引入NPM包，但支持类CommonJS的模块引用。weact在语法上实现ES模块间引用, 用*babel-plugin-transform-modules-commonjs*解析成CommonJS的包；NPM包也会被拷贝到*modules*目录下。*weact*模块并没有代码存在，暂时只为了符合语法。\n\nimport方式 | JS/JSX | 小程序\n----------|--------|-------\n模块间 | `import reducer from './reducer'` | `var _reducer = require(\"./reducer.js\");`\nNPM包 | `import redux from 'redux'` | `var _redux = require(\"modules/redux.js\");` \n引用Page | `import './pages/index.jsx'` | *app.json* `{\"pages\":[\"pages/index/index\"]}`\n引用Component | `import Component from '../components/Component.jsx'` | *\\*.json*: `{\"usingComponents\":{\"Component\":\"../../components/Component/Component\"}}`\n引用Template | `import MsgItem from './MsgItem.jsx'` | *wxml* `\u003cimport src=\"../MsgItem.wxml\" /\u003e` \n\n\u003e 引用的NPM包需用npm或yarn安装 \n\n### Promise和async/await\n---\n\nweact支持Promise的相关语法，也支持async/await。你可以在App和Page的类方法上使用`async`来定义异步函数，然后就可以在这函数内使用`await`来处理异步或Promise函数。为了方便用`await`方式调用微信小程序API的异步函数，weact内置的模块Promise化了这些接口，具体使用方法参考[ Promise化微信小程序/小游戏API ](#Promise化微信小程序/小游戏API)\n```javascript\n// in page.jsx\nimport { wx } from 'weact'  // 引用Promise化的wx接口\nexport default class extends Page {\n  async onLoad() {\n    const wait = () =\u003e new Promise((resolve, reject) =\u003e {\n      setTimeout(function() {\n        resolve('小程序')\n      }, 1000)\n    })\n    const who = await wait() // 调用自定异步函数\n    console.info(who)\n    const systemInfo = await wx.getSystemInfo() // 调用Promise化的wx接口\n    console.info(systemInfo)\n  }\n}\n```\n\u003e async/await最终执行依赖于目标设备的支持\n\n### Promise化微信小程序/小游戏API\n---\n\nweact内置了Promise化的微信小程序和小游戏的API, 编译后会引入*weact.js*。Promise化的规则\n\n- 接口含参数`success`和`fail`的API被Promise化，其他参数不变\n- `success`对应`Promise.resolve`，`fail`对应`Promise.reject`\n- 参数`complete`暂不支持\n- 保留已有同步接口（Sync结尾的函数）和监听接口（以on/off开头的函数）\n\n\n```javascript\nimport { Page, wx } from 'weact'\n\nexport default class extends Page {\n  state = {\n    storage: 'nothing',\n  }\n  onLoad() {\n    // 原接口 wx.getStorage({ key, success, fail, complete })\n    wx.getStorage({ key: 'store' }) \n    .then(rs =\u003e {\n      this.setState({ storage: rs})\n    }, err =\u003e {\n      this.setState({ storage: err.errMsg})\n    })\n  }\n  render () {\n    ...\n  }\n```\n详细API的使用参考\n* [小程序API开发文档](https://mp.weixin.qq.com/debug/wxadoc/dev/api/)\n* [小游戏API开发文档](https://mp.weixin.qq.com/debug/wxgame/dev/api/)\n\n\n### 命令行用法 \n---\n\n使用: weact [options] \u003csource\u003e \u003ctarget\u003e\n\n- source 源码目录路径或app.jsx文件路径\n- target 代码生成路径=./dist\n\noptions:\n* -v, --version               显示版本 \n* -h, --help                  显示当前内容 \n* -w, --watch                 Watch源码变化，自动更新代码\n\n__例子__:\n\n- 在当前路径./dist目录下生成代码\n\n`weact examples/01.hello.world/`\n\n- 指定代码生成路径\n\n`weact examples/01.hello.world/ ./your_distribution`\n\n- watch模式, 根据源码改动，自动更新生成代码\n\n`weact -w examples/01.hello.world/`\n","project_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fhaojy%2Fweact","html_url":"https://awesome.ecosyste.ms/projects/github.com%2Fhaojy%2Fweact","lists_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fhaojy%2Fweact/lists"}