weflow(前端开发工具)是由腾讯开发的一款免费的web前端开发工具,weflow(前端开发工具)基于 tmt-workflow 工作流,代码开源可定制,具有高效、强大、跨平台的特点,支持微信游戏,朋友圈广告,微信城市服务,微信摇电视。需要的朋友可以下载!
一、自动化流程:
Less / Sass -> CSS 编译
CSS Autoprefixer 前缀自动补全
自动生成图片 CSS 属性,width & height 等
CSS cssnano 压缩
CSS Sprite 雪碧图合成
Retina @2x & @3x 自动生成适配
Imagemin 图片压缩
JS 合并压缩
EJS 模版语言
二、调试 & 部署:
监听文件变动,自动刷新浏览器 (LiveReload)
S/FTP 发布部署
Zip 项目打包
三、解决方案集成:
px -> rem 兼容适配方案
智能 WebP 解决方案
去缓存文件 Reversion (MD5) 解决方案
自动修复器
tmt-workflow集成了自动补全功能,代码里只需按标准来写即可。注意只有在gulp build_dist才有自动补全开发版本按照最新最炫的来
配置gulpfile.js
配置选项
设置希望被自动生成的CSS属性
设置生效的图片目录
CSS输入
提示:输出CSS可配合使用PostCSS进一步处理
说明
如果width/ height/ background-size等属性已存在,则不会覆盖对应的原始属性值。
使用background-image: url()或background: url()均可被正确识别。
通过读取图片HEX数据取得图片宽/高信息,大大提升相应速度,参看:fast-image-size。
通过文件签名判断检测图片类别,如:PNG&JPG。
去掉图片最小buffer size的限制,参看:/ fast-image-size / pull / 5。
PostCSS插件解析CSS并使用Can I Use中的值将供应商前缀添加到CSS规则 。它 由Google 推荐并在Twitter和阿里巴巴中使用。
编写没有供应商前缀的CSS规则(事实上,完全忘记它们):
Autoprefixer将使用基于当前浏览器流行度和属性支持的数据为您应用前缀。您可以尝试 Autoprefixer 的交互式演示。
Autoprefixer使用浏览器列表,因此您可以使用类似的查询指定要在项目中定位的浏览器> 5%
提供浏览器的最佳方式是.browserslistrc项目根目录中的文件,或者通过向您的项目添加browserslist密钥package.json。
我们建议使用这些选项而不是将选项传递给Autoprefixer,以便可以与其他工具共享配置,例如babel-preset-env和 Stylelint。
同类推荐
2022-03-25
立即下载2022-06-13
立即下载2022-06-14
立即下载2022-06-21
立即下载2022-06-24
立即下载2022-06-28
立即下载相关文章
Adobe Acrobat Reader DC怎样禁止创建URL链接?
2023-07-20360驱动大师下载路径在哪儿?
2022-12-25暴风Win10激活工具v17.0绿色版下载
2022-12-25有道云笔记制作笔记教程
2022-12-25企业微信开启语音自动转文字功能的方法
2022-12-18百度地图App添加自己的店铺的方法
2022-12-11如何创建子报表?Access创建子报表的方法
2022-12-04墨刀怎么导出原型?墨刀导出原型的方法
2022-11-26PowerPoint 2019然后打造滚动数字动画?
2022-11-12Firealpaca更换背景颜色图文教程
2022-11-12