渐进式小程序开发框架
# wxa.js
轻量级的渐进式小程序开发框架，专注于小程序原生开发，提供更好的工程化、代码复用能力，提高开发效率并改善开发体验。
极速上手，零配置，可无痛迁移。
**框架优势**
- 🖖 **极速上手** 无额外的学习门槛，可以完全使用原生的小程序语法开发。
- :surfer: **零配置** 标准项目无需任何配置，即可运行。
- :light_rail: **低成本** 超低迁移成本，原生小程序可以马上在 `@wxa/cli2` 中跑起来。支持原生和 wxa 混杂开发，助力老项目逐步迁移。
- :rocket: **依赖分包算法** 自研的依赖分包算法，帮助开发者充分的利用[分包空间](https://developers.weixin.qq.com/miniprogram/dev/framework/subpackages/basic.html)。
- :curly_loop: **依赖分析** 自动分析项目依赖，无需手动 copy 三方依赖到项目中。
- :penguin: **全方位** 提供小程序开发增强能力，譬如状态管理、表单校验等。
- 🤖 **按需引入** 任意第三方工具、组件库，随时安装使用，完美适配 weui, vant-weapp等组件库。
- :alien: **多实例** 一次性编译出多个三方项目或其他平台的小程序，如头条小程序。
More detail [Documents](https://webank.gitee.io/wxa/)
更完善的[文档](https://webank.gitee.io/wxa/)
## 安装使用
使用 `yarn` 或 `npm` 全局安装
```bash
npm i -g @wxa/cli2
```
**极速新建项目**
```bash
wxa2 create
```
**启动开发环境**
```bash
wxa2 build --watch
```
## 开发示例
#### app.wxa
```html
{
"pages": [
"pages/index"
]
}
```
#### pages/index.wxa
```vue
{
"navigationBarTitleText": "Hello Wxa"
}
Hi, 提交
```
默认导出的方法将会自动调用小程序相应的 `Page`、 `Component`、 `App` 方法进行注册。
更完善的[文档](https://webank.gitee.io/wxa/)
**极速预览小程序**
```bash
wxa2 cli --action preview
```
## 技术特点
wxa 是一个 AOP 框架，主要使用 Decorator（运行时改写，拦截）和预编译实现框架功能。
使用 Decorator 实现了：
- :white_check_mark: **`Fetch`** 自动防重，自动队列管理的网络请求方法。
- :white_check_mark: **`Router`** 简洁的 API、预加载特性。
- :white_check_mark: **`Eventbus`** 跨页面，跨组件交互的简单方案。
- :white_check_mark: **`Mixins`** 混合，跨页面、跨组件复用逻辑。
- :white_check_mark: **`Diff`** 增量设置数据。
- :white_check_mark: **`Storage`** 小程序持久化缓存数据。
- :white_check_mark: **`SessionStorage`** 应用周期内缓存数据。
- :white_check_mark: **`Lock`** 防止重复执行函数，前端防重利器。
- :white_check_mark: **`Debounnce`** 防抖动。
查看详细的 [Class Decorators](https://webank.gitee.io/wxa/core/API.html#decorators-%E7%B1%BB%E8%A3%85%E9%A5%B0%E5%99%A8)
预编译方面，实现了对小程序项目的依赖解析，利用依赖树对整个项目进行管理，以此为基础适配了`npm`、单文件开发、云开发、三方开发。开发语法方面支持最新的 ES\*语法（包括 Async/Await）、Sass/Scss、Stylus，有需求的话可以适配更多语法。
## wxa生态
|包名|描述|版本
|-----|----|----|
|@wxa/core|wxa运行时核心|
|@wxa/cli2|wxa编译时与命令行工具|
|@wxa/validate|表单验证、支持自定义校验规则和提示|
|@dfgyhujk7npm/asperiores-ad-vel| watch & computed |
|@wxa/log| 小程序实时日志上报 |
|@wxa/mobx|wxa引入mobx|
|@wxa/redux|wxa引入redux|
|@wxa/plugin-uglifyjs| 压缩美化 Javascript 代码 |
|@wxa/plugin-replace| 任意字符替换，用于生产测试参数替换 |
|@wxa/plugin-copy| 复制指定静态资源 |
|@wxa/plugin-bind-hijack| 劫持小程序bind事件插件 |
|@wxa/plugin-minify-wxml| wxml 压缩 |
|@wxa/plugin-postcss| 自定义需要引入的postcss插件 |
|@wxa/plugin-dependencies-analysis| 项目构建后的模块依赖关系、体积大小等信息可视化, 方便分析项目的优化空间。|
| [wxa-vscode](https://github.com/WeBankFinTech/wxa-vscode) | vscode 插件。开箱即用，安装完毕你将获得：代码自动填充、格式化; 语法高亮、检查（包括wxml、wxs文件）; 代码片段提示; 单文件组件支持 |
## 社区微信群
社群二维码过期可联络
邮箱 junbiaoli@webank.com、iveswen@webank.com
项目负责人微信 szyshangzhiyuan （加好友请备注：wxa）
## Contributors ✨
Thanks goes to these wonderful people ([emoji key](https://allcontributors.org/docs/en/emoji-key)):
