关于JDFX

JDFX是京东前端团队自主研发的一款自动化构建工具，目的是合理、快速和高效的解决前端开发中的工程和项目问题，核心集成了本地调试、本地构建、远程布署、代码生成等一系列开发命令工具。

安装使用

• [email protected]到最新LTS版本可用

$ npm install jdfx -g

• 执行jdf -V，测试是否安装成功（注意是大写的V）

• 快速开始

• 配置config.json

更新日志

完整日志

3.4.12 / 2018/08/15 19:58:00

• [add] 支持autoprefixer的browserslist配置，灵活输出浏览器前缀。

说明文档

• 示例安装
• 命令文档
• 配置文档
• api调用文档
• css优化策略
• css雪碧图
• smarty模版
• tpl模版
• vm模版
• widget说明
• widgetOutputName标签
• 插件模块

使用攻略

• 文件路径拼写说明
• 移动端页面开发

功能介绍

跨平台

• 完美支持windows、mac、linux三大系统

项目构建

• 生成标准化的项目文件夹
• 支持本地联调，本地编译，测试预览等开发流程
• 每个项目拥有独立的配置文件，按选项统一编译

模块开发

• 可快速方便的对模块进行创建，引用，预览，安装和发布
• 通过积累，可形成完全符合自己业务的模块云服务
• 支持将vm和smarty模版编译为html
• 支持将sass和less编译为css
• 支持velocity语法
• 支持ES6(需要将js文件后缀改为.babel)

项目输出

• 自动将页面中的js、css引用转换成combo请求格式
• 自动压缩优化js、css、图片文件
• 默认给所有静态资源添加CDN域名
• 支持cmd规范，自动提取文件id和dependencies，压缩时保留require关键字
• 自动生成css精灵图，并更新background-position属性值
• 自动生成base64编码
• 自动给css样式添加相应的浏览器前缀
• 支持图片生成webp格式，并更新相关css图片链接
• 压缩css、js、图片文件，并且可根据当前项目中的文件数量自动决定是否启用多线程进行压缩，当前的数量阀值是200
• 自动给js，css文件的内容头部添加时间戳，方便查看
• 文件编码统一输出为utf8

项目联调

• 一键上传文件到测试服务器，方便其他同学开发预览

本地服务

• 支持开启本地服务器，方便调试
• 支持本地静态文件预览，内置本地开发调试服务器，以及当前目录浏览
• 支持实时监听文件，文件被修改时会自动编译成css，并刷新浏览器
• 内置browserSync
• 详细文档

辅助工具

• 支持html/js/css文件格式化
• 支持html/js/css代码压缩
• 支持html/js/css文件lint，代码质量检查

集成工具

• 在本地任意目录开启一个server静态服务器
• html/js/css文件lint代码质量检查
• html/js/css文件格式化
• csssprite图片合并

widget组件

• 详情请参考widget文档
• vm模版文档
• tpl模版文档
• smarty模版文档

编译器插件

• Sublime Text2 插件