基于Gulp构建的微信原生小程序的开发工作流
- 基于
gulp+less
构建的微信小程序工程项目 - 项目图片自动压缩
- ESLint代码检查
- 使用命令行快速创建
page
、template
和component
font
字体文件转换成base64
该项目代码来源于 https://github.com/YangQiGitHub/wx-miniprogram-boilerplate 。因不够满足开发需求,所以个人对代码添加一些开发功能,以及修复原代码一些坑。
/dist/
小程序npm构建支持font
字体文件转换成base64- 修复
gulp auto
生成模板的文件路径问题
$ npm install --global gulp-cli
$ git clone https://github.com/AKA-BEN/wxmp-workflow-template.git
$ cd wxmp-workflow-template && npm install
$ npm run dev
gulp auto -p mypage 创建名为mypage的page文件
gulp auto -t mytpl 创建名为mytpl的template文件
gulp auto -c mycomponent 创建名为mycomponent的component文件
gulp auto -s index -p mypage 复制pages/index中的文件创建名称为mypage的页面
$ npm run build
wxmp-workflow-template
├── dist // 编译后目录
│ ├── miniprogram_npm // 小程序npm构建生成
│ ├── node_modules // 小程序模块依赖
│ ├── package-lock.json
│ ├── package.json
├── node_modules // 项目依赖
├── src
│ ├── assets // 资源文件
│ │ ├── fonts // 字体源文件
│ │ ├── images // 图片资源
│ ├── behaviors // 公用behavior
│ ├── components // 微信小程序自定义组件
│ ├── images // 页面中的图片和icon
│ ├── pages // 小程序page文件
│ ├── styles // ui框架,公共样式
│ ├── template // 模板
│ ├── utils // 公共js文件
│ ├── app.js
│ ├── app.json
│ ├── app.less
│ ├── project.config.json // 项目配置文件
│ └── api.config.js // 项目api接口配置
├── .gitignore
├── .eslintrc.js
├── package-lock.json
├── package.json
└── README.md