cvmachine.com - 申博开户网

搜索: 您的位置主页 > 电脑频道 > 电脑教程 > 阅读资讯:使用weflow的方法

使用weflow的方法

2018-04-13 21:46:12 来源:www.cvmachine.com 【

使用weflow的方法

weflow是什么?weflow如何使用?WeFlow一个高效、强大、跨平台的前端开发工作流工具,具体的说就是一个 GUI 的前端工具,可以为用户提供一套标准化、规范化的工作流程,从而让大家在交接协作的时候更为高效有序。接下来小编就给大家简单介绍一下weflow怎么用,以及如何配置文件,需要的用户欢迎借鉴!

 

weflow怎么用?

1.开发任务 gulp build_dev

添加文件点击开发,进入开发模式

使用weflow的方法

自动创建与 src 目录一致的 dev 目录存放 ejs 和 less 编译后的文件

自动监听所有文件变动

监听到文件变动时自动刷新浏览器, 可在工作流配置文件 .tmtworkflowrc 选择开启或关闭

使用weflow的方法

2. 生产任务 gulp build_dist

当开发完成之后,点击生产编译,执行 gulp build_dist 生成可供发布上线的最终文件。 自动生成 dist 目录,存放所有经过编译合并的文件

使用weflow的方法

3. FTP 部署 gulp ftp

此任务依赖于 生产任务,执行 gulp ftp时,会先执行 gulp build_dist 生成 dist 目录,然后将生成的 dist 目录上传至 .tmtworkflowrc 指定的 ftp 地址。

4. 打包 gulp zip

执行 zip 任务时,会先执行 gulp build_dist 生成 dist 目录,再将其打包压缩成 zip 包。

配置文件

在与项目同级的目录下,有一个全局的 .tmtworkflowrc 配置文件,项目下也可以有一个 .tmtworkflowrc,程序运行时先寻找当前目录下是否有配置文件,如果没有,则继续往上一层目录寻找,直到系统目录

我们使用 rc 组件来管理配置文件。如果项目下不存在 .tmtworkflowrc 文件,将会根据以下优化级进行寻找配置。

系统环境变量以 tmtworkflow_ 开头的变量,(例如: tmtworkflow_foo__bar__baz => foo.bar.baz)

项目目录下的 .tmtworkflowrc 或依次向上遍历查找 ./ ../ ../../ ../../../

$HOME/.tmtworkflowrc

$HOME/.tmtworkflowrc/config

$HOME/.config/tmtworkflowrc

$HOME/.config/tmtworkflowrc/config

/etc/tmtworkflowrc

/etc/tmtworkflowrc/config

工作流默认配置

.tmtworkflowrc 配置示例

{

//ftp 配置

"ftp": {

"host": "xx.xx.xx.xx",

"port": "8021",

"user": "tmt",

"pass": "password",

"remotePath": "remotePath", //默认上传到根目录下,配置此属性可指定具体子目录

"includeHtml": true //ftp 上传是否包含 html

},

//自动刷新

"livereload": {

"available": true, //开启自动刷新

"port": 8080,

"startPath": "html/TmTIndex.html" //启动时自动打开的路径

},

//插件功能

//路径相对于 tasks/plugins 目录

"plugins": {

"build_devAfter": ["TmTIndex"], //dev 任务执行后自动执行

"build_distAfter": [], //build 任务执行后自动执行

"ftpAfter": ["ftp"] //ftp 任务执行后自动执行

},

"supportWebp": false, //编译使用 webp

"supportREM": false, //REM转换

"reversion": false //新文件名功能

}

教程结束,以上就是关于weflow如何使用?weflow的使用及配置文件教程的全部内容,希望大家喜欢!更多精彩,尽在申博开户网站!

 

本文地址:http://www.cvmachine.com/dnjc/98313.html
Tags: 教程 配置文件 weflow
编辑:申博开户网
  • 上一篇:在excel图表中添加趋势线的方法
  • 下一篇:没有了
  • 关于我们 | 联系我们 | 友情链接 | 网站地图 | Sitemap | App | 返回顶部