@wxa/cli2

详细的文档

More Detail Documentation

为小程序开发定制的命令行工具。以模块化方式处理项目依赖，通过依赖分析得到整个项目的结构，在优化代码后最终生成目标小程序代码。

插件机制上面，采用最新webpack设计的Tapable插件机制，对于熟悉webpack插件开发的人来说，可以快速上手cli的插件开发。

助力三方开发。对于三方项目而言，往往需要在使用框架的同时再手写脚本，以保证一个项目能编译到多个小程序。2.0在这方便做了改进，利用依赖分析树针对不同合作方输出不同页面，支持一次性将项目编译到出多个小程序，同时支持监听模式下的一对多（可能会内存占用高，慎用）。

特性

• :white_check_mark: Npm 直接在项目引入node_modules的内容，无需手工复制依赖库。
• :white_check_mark: Vue单文件 组件和页面可以把js,wxss,wxml,json写在同一个.wxa文件。
• :white_check_mark: 第三方组件 在usingComponents中直接引入即可。
• :white_check_mark: 插件机制 利用插件机制，可以定制自己的文件处理流。
• :white_check_mark: 编译器 支持ES*, Sass, Stylus。
• :white_check_mark: CLI调用 无需打开开发者工具，即可预览、上传代码。:airplane:
• :white_check_mark: 三方开发 一次性编译出多个三方小程序。

TODO

• :ballot_box_with_check: 编译到其他小程序平台
• :ballot_box_with_check: 小程序原生插件开发
• :ballot_box_with_check: Tree-Shaking

安装

# 使用npm安装
npm i -g @wxa/cli2@next

::: tip 提示 @wxa/cli2运行在node环境中，先安装node。 :::

基本用例

1. 基础编译 wxa2 build

2. 监听模式 wxa2 build --watch

3. 指定无效缓存以及打印更详细的构建信息 wxa2 build --no-cache --verbose

4. 使用模板创建新项目, template wxa2 create

5. 调用微信开发者工具, windows用户需要在 wxa.config.js 设置开发者工具的路径 wechatwebdevtools

   • wxa2 cli -a open: 打开开发者工具
   • wxa2 cli -a preview: 预览项目
   • wxa2 cli -a upload: 上传项目
   • wxa2 cli -a login: 登录微信，preview和upload都需要登录微信后操作

6. 原生代码转换为 .wxa 代码
   wxa convert -i <src directory> -o <output directory>