FEinit基于Nodejs​ 的前端工具集

联合创作 · 2023-09-23 17:27


FEinit 是基于Nodejs 的前端工具集,因为是在windows系统开发,所以目前仅适合 windows 系统。


主要功能:



  • 提供前端项目中常用的工具集



    • 相对于grunt的task文件形式,FEinit的task是在命令行执行


    • 适合临时性、零碎的task需求



  • 通过template快速创建(前端)项目


  • 提供插件机制,每个FEer都可以开发自己的fe工具



环境要求:



  • 安装了nodejs


  • compass和sass需要ruby支持,我用的版本是2.0


  • windows系统如果添加右键失败,请更换管理组用户重试



开发匆忙,难免有bug,可以在线提issue


安装



npm install feinit -g fe -h fe -v

P.S.:安装最后会选择是否添加鼠标右键功能


fe -h or fe --help


查看帮助文件


template功能


生成(前端)项目的默认文件,可以指定自己电脑任意文件夹为项目模板(称为template),使用时:



  • 进入要创建项目的文件夹


  • 执行 fe init templateName


  • fe自动复制对应的template文件夹所有文件到当前路径



template帮助



fe template -h

fe自带默认项目的src文件夹结构如下



│  index.html             //首页

├─img                    //图片
│  └─pic                 //切图临时占位图片       
├─js                     //js文件夹
│      jquery.1.4.2.js 
│      jquery.1.8.2.js    
│      zepto.js

└─sass                   //compass sass文件夹
        _base.scss       //compass bass文件

支持的task


列出支持的task命令



## 获取task 
list fe task

所有task支持查看帮助,使用 fe task_name -h 获取帮助,例如:



## 获取concat的帮助 
fe concat -h

fe concat


功能


合并文件


基本语法



filename [files..] -o dest ## 举例 fe concat file1 file2 file3 -o concat

fe css


功能


合并css,支持import语法解析。


基本语法



fe css [options] filename [folder/files..] -o dest.css 
## 举例 
fe css a.css b.css -o ab.css 
fe css -c a.css b.css -o ab.min.css


  • 选项



    • -c 压缩


    • -b 格式化



  • 默认



    • 合并


    • 压缩




fe js


功能


合并压缩js


基本语法



fe js [options] filename [folder/files..] -o dest.js 
## 举例 
fe js file.js file2.js -o min.js 
fe js file.js file2.js -o min.js --noascii


  • 选项



    • -b or --beautify 格式化


    • --noascii 不ascii化,即不会将中文转为 \uXXX 格式



  • 默认



    • 压缩


    • 合并


    • ascii化




 


常见参数缩写



  • -h: --help     //帮助


  • -l: --list     //列表


  • -c: --create   //创建


  • -e: --edit     //修改


  • -rm: --remove  //删除


  • -v: --version  //版本



二次开发


支持二次开发和DIY自己的task,称之为plugin机制,即实现的一种插件机制,通过提供的接口实现一个task功能


命令 fe task --list 可以显示所有支持的 task 列表。


添加一个plugin



fe plugin -c my-first-task

上面命令在 fe 的tasks文件夹中创建了一个名字为 my-first-task.js 的文件,打开后您会看到基本内容已经写好了,您要做的就是专注于自己plugin的功能即可。


plugin开发完成后,使用:



## 查看帮助 
fe my-first-task -h  
## 执行命令 
fe my-first-task [options] [-o] [destOptions]

P.S.



  • plugin名称为字母、数字和下划线(_)组成,并且不得与之前的task重名



右键菜单


仅支持windows系统,安装时按照提示填写 Y 安装即可


使用:需要操作的文件使用鼠标右键



卸载



npm uninstall -g feinit

 

浏览 23
点赞
评论
收藏
分享

手机扫一扫分享

编辑 分享
举报
评论
图片
表情
推荐
点赞
评论
收藏
分享

手机扫一扫分享

编辑 分享
举报