@axetroy/webuild

2020-01-16

@axetroy/webuild

零配置无侵入式的微信小程序开发工具

零配置, 无侵入式的小程序开发工具

Build StatusDependencyPrettierNodenpm versionLicense

工欲善其事, 必先利其器

特性:

  • <input checked="" disabled="" type="checkbox"> 支持微信/支付宝小程序
  • <input checked="" disabled="" type="checkbox"> 零配置, 你所需要的, 都已经有了
  • <input checked="" disabled="" type="checkbox"> 无入侵. 兼容原生开发方式. 不用更改一行代码.
  • <input checked="" disabled="" type="checkbox"> 支持引入 NPM 模块
  • <input checked="" disabled="" type="checkbox"> 支持 ES2015, ES2016, ES2017...
  • <input checked="" disabled="" type="checkbox"> 强力压缩 JS, 极大节省包体积.
  • <input checked="" disabled="" type="checkbox"> 支持图片压缩, jpg/jpeg/mozjpeg/png/gif/webp/svg
  • <input checked="" disabled="" type="checkbox"> WXSS/WXML/JSON 压缩
  • <input checked="" disabled="" type="checkbox"> 支持使用css/sass/less代替wxss,xml代替wxml
  • <input disabled="" type="checkbox"> 基于 AST 压缩 WXSS/WXML(把 className 替换成 1 个字符)
  • <input checked="" disabled="" type="checkbox"> 支持环境变量process.env, 默认有NODE_ENV. 也可以自定义变量WEBUILD_XX

该项目为开发工具, 不是小程序框架.

安装

npm install @axetroy/webuild -g

快速开始

webuild init my-mini-app
cd my-mini-app
npm start

如何使用

假设你的小程序项目目录

.
├── app.css
├── app.js
├── app.json
└── pages
    ├── detail
    │   ├── index.css
    │   ├── index.js
    │   └── index.xml
    └── index
        ├── index.css
        ├── index.js
        └── index.xml

创建一个src目录,并且把小程序项目源码放在src目录下, 并且运行

# 运行命令, 监听文件变化并打包编译
webuild dev

# 发布项目
webuild build

源码 src 已被编译至 dist 目录.

打开微信/支付宝开发者工具, 加载 dist 目录即可

需要关闭 ES6转ES5选项

命令行

$ webuild --help

   webuild 0.3.5 - 零配置无侵入式的微信小程序开发工具

   USAGE

     webuild <command> [options]

   COMMANDS

     init <name>         初始化一个新项目                   
     dev                 以开发模式运行                     
     build               构建生产模式                       
     help <command>      Display help for a specific command

   GLOBAL OPTIONS

     -h, --help         Display help                                      
     -V, --version      Display version                                   
     --no-color         Disable colors                                    
     --quiet            Quiet mode - only displays warn and error messages
     -v, --verbose      Verbose mode - will also output debug messages

Example

  • Official: 官方小程序组件
  • CNode: 试验下的 CNode 社区
  • Icehome: 冰冰家纯手工店小程序

Contributing

Contributing Guide

如果你觉得项目不错,不要吝啬你的 star.

长期造轮子,欢迎 follow.

Contributors

| Axetroy<g-emoji class="g-emoji" alias="computer" fallback-src="https://github.githubassets.com/images/icons/emoji/unicode/1f4bb.png">💻</g-emoji><g-emoji class="g-emoji" alias="bug" fallback-src="https://github.githubassets.com/images/icons/emoji/unicode/1f41b.png">🐛</g-emoji><g-emoji class="g-emoji" alias="art" fallback-src="https://github.githubassets.com/images/icons/emoji/unicode/1f3a8.png">🎨</g-emoji> | | :-: |

License

FOSSA Status

以上是 @axetroy/webuild 的使用教程帮助文档。


上一篇:@choerodon/boot
下一篇:@axetroy/libpack
相关教程
关注微信

扫码加入 JavaScript 社区

相关文章
暂无相关文章

首次访问,需要验证
微信扫码,关注即可
(仅需验证一次)

欢迎加入 JavaScript 社区

号内回复关键字:

回到顶部