Ykit
Ykit 是一套可配置和可扩展的前端开发工具集,核心功能包括资源打包、静态资源服务、代码质量检测。Ykit 基于 webpack,支持 CommonJs, AMD, ES6 modules, Coffeescript, CSS, SASS, LESS 等模块类型的打包。
Ykit 的初衷在于快速搭建不同的开发环境。它提供一个可靠的基础配置,通过可插拔的插件来进行扩展(编译插件、服务中间件、工具和命令...),并让开发者可以灵活地根据不同项目来修改配置。
详细文档请查看 http://ued.qunar.com/ykit/docs.html
Features
- 本地静态资源服务
- 一键配置的开发环境
- 自带 lint 工具和预设规则
- 自带代理工具,可实现 SwitchHost + Charles 的基本功能
Install
(sudo) npm install ykit -g
Usage
Init
通过 init 命令快速搭建一个项目脚手架:
- 创建一个项目目录
- 进入目录执行
ykit init [<type>]
初始化时可以选择项目类型(type 留空则为基础脚手架),目前支持的初始化类型:
- yo
- qunar
Server
在项目目录外执行命令:
(sudo) ykit server // 或者使用缩写 ykit s
访问 localhost/项目目录/index.html
Pack
在项目中执行命令:
ykit pack -m
将会对资源进行编译打包压缩,默认会打到 prd
目录。
配置 ykit.{type}.js
项目中的配置文件。其中 type 指的是当前项目环境的名称。比如 ykit.js
(基础环境)、ykit.yo.js
或者 ykit.qunar.js
。配置文件样例:
exports.config = function() {
return {
// export 定义项目资源入口,在本地服务请求时,会实现 /src -> /prd 目录的对应
// 比如在 html 中请求 /prd/script/index.js,则会编译 /src/script/index.js 并返回编译结果
export: ['./scripts/index.js', './styles/index.scss',],
// ykit 本身会有基础 webpack 配置
// 通过该函数可以获取(通过参数 baseConfig)和修改它
modifyWebpackConfig: function(baseConfig) {
// ...
return baseConfig
}
}
};
详细配置请参考 ykit-配置。