mywebpack

MyWebpack

My webpack integrated CLI for multi-entries and collaborative projects.

多入口 Webpack 项目集成开发工具链。

Features

• 初始化项目结构 CLI，提供从 yaml 定义自动生成 entries 文件
• 提供多个命令分别支持项目开发环境，编译以及测试或生产发布，提供 bundle 分析 功能
• 开发环境，提供自动编译功能：根据访问的页面自动编译需要的 entry 相关代码， 按需编译，加快开发编译等待时间
• 编译 bundles，可指定将常用的venders库打包为dll bundle，其他页面逻辑代 码打包为[entryName].[contentHash]对应的 bundle，最小化文件改动，最大化利 用资源缓存
• 发布文件，支持多选或全选 entries 进行发布，按需发布，加快发布速度，并自动 推送至指定的部署仓库，实现持续集成和交付
• 代码格式化，集成Prettier，统一协作开发者提交的代码风格

Install

npm add mywebpack -g

or

yarn global add mywebpack

Usage

• 初始化

mpk init

• 生成 entries

mpk gen

• 开发

mpk start

• 编译

mpk build

• 分析

mpk analyze

• 格式化

mpk pretty

• 发布

mpk publish

请定义项目根目录的mpk.config.js

Notes

• React+TypeScript+LESS/SASS/CSS 栈
• 默认会查找与 entry 同名的 html 模板文件，不存在则会使用 index.html
• 项目初始化的结构src/assets/styles/global文件夹下的样式文件不会应用CSS Module，其他地方引用样式会应用CSS Module解析
• 配置文件中webpack配置项可配置externals与resolve
• Bundle analyzer会使用开发相同的devHost, dll bundles使用devPort+1 端口 ，其他bundles使用devPort+2 端口

License

MyWebpack is freely distributable under the terms of the MIT license.