npm:fangfis-cli

README

fangfis-cli 是一套与 fang.js 完善结合的自动化代码构建工具。

fangfis-cli 是一个基于 Node 的前端构建工具，根据房天下前端开发需求进行了相应的定制，支持 CSS 的压缩、JS 的 ES6 转 ES5、合并、压缩、混淆等功能，通过 FangFIS 结合 fang.js，我们可以方便快速地处理前端静态资源文件，减少了多余的工作，提高开发效率和代码性能。

详细教程

教程地址

** fang.js是基于cmd上的封装,原则上该框架可以和基于cmd的所有框架配合使用(例如:seajs) 相关seajs的用法可以参考下面文档,这里提供一个seajs的cdn资源

https://www.zhangxinxu.com/sp/seajs/

<script src="https://cdn.bootcss.com/seajs/2.3.0/sea.js"></script>

** 开发代码库,有问题欢迎提issue http://gitlab.light.fang.com/fex/platfrom-fangfis/issues

需要注意，本地开发的代码，必须先通过 fangfis-cli 进行构建才能发布到正式环境。

安装

fangfis-cli 基于 Node.js，因此在开始安装之前，确保你的系统安装了 Node.js 环境。(Nodejs >= 4.x, npm > 3.x)

$ npm install -g fangfis-cli

使用

输入项目名称，默认为空即在当前文件夹下初始化。

$ fangfis init

该文件夹下不为空提示，可以选择继续，不会删除已有文件。

构建完成后默认自动安装所需要的依赖模块，如果自动安装失败，请进入该目录，手动安装，推荐使用cnpm安装参考地址: cnpm

$ npm install
or
$ cnpm install

初始化完成后的结构

.
├── dev
│   ├── css
│   ├── images
│   └── js
├── fangfis.config.json
├── package-lock.json
├── package.json
└── static
5 directories, 3 files

注:

dev文件夹目前版本为构建工具预留目录，所有开发项目必须在该目录下开发，下面的css、js和images文件夹的名字不能更改。

构建配置

init自动生成默认配置文件fangfis.config.json,用户可以自定义配置选项以控制构建,配置结构如下:

{
    // 构建配置项
    "build": {
        // 自定义输入目录,相对路径,默认为dev 注: 自定义路径下需要有js,images,css文件夹
        "input": "./dev",
        // 自定义输出目录,默认为static
        "output": "./static",
        // 模块基本路径,构建工具会自动根据该基本路径进行寻找模块
        "base": "./dev/js",
        // 入口文件支持多种格式
        /* *main
            main,main2
            main,main2,ery*
            module/js/main
            module/js/main,module/js/main2
            module/js/main,module/js/main2,module/js/ery*
            main*
            *main
            main_*tool
        */
        "main": "main",
        // 模块合并配置项
        "combo": {
            // 忽略模块,默认jquery
            "ignore": [
                "jquery"
            ],
            // 需要额外处理的模块,格式同main
            "addMod": ["main2"],
            // fangjs配置
            "config": {
                "alias": {
                    "jquery": "jquery",
                    "util": "plugins/util"
                },
                "paths": {
                    "webim": "//js.soufunimg.com/upload/webim"
                }
            }
        }
    },
    // 上传ftp配置
    "upload": {
        // 默认配置
        "default": {
            // host
            "host": "localhost",
            // 用户名
            "user": "anonymous",
            // 密码
            "pass": "anonymous@",
            // 本地待上传目录
            "input": "./static",
            // ftp路径 相对于ftp根路径
            "output": "./static",
            // 端口
            "port": 21,
            // 连接超时时间 单位:分钟
            "idleTimeout": 100,
            // 最大连接数
            "maxConnections": 5
        },
        // 同default
        "online": {
            "host": "localhost",
            "user": "anonymous",
            "pass": "anonymous@",
            "input": "./static",
            "output": "./static",
            "port": 21,
            "idleTimeout": 100,
            "maxConnections": 5
        }
    }
}

fangfis build

使用fangfis进行构建。

构建选项如下：

    -w, --watch           监听文件变化并自动构建
    -j, --js              压缩js文件到目标文件夹,入口文件`自动合并`所有依赖到目标文件夹,默认: static/js
    -c, --css             压缩所有css文件到目标目录,输入目录为`dev/css`,不可自定义,输出目录可自定义,默认: static/css
    -i, --img             拷贝所有img文件到目标目录,输入目录为`dev/images`,不可自定义,输出目录可自定义,默认: static/imgages
    -o, --output [value]  自定义输入目录,可自定义到一级,默认: ./static
    -m, --main [value]    自定义入口文件,只能传入正则表达式,默认: /^entry_.*\.js$/i
    -s, --sourcemap       是否生成sourcemap文件,默认不生成
    -u, --upload          构建完成后是否自动上传ftp
    -h, --help            帮助信息

例子：

$ fangfis b -o ./test1 -cjiw
or
$ fangfis build -o ./test1 -c -j -i -w

建议使用默认输出目录

fangfis upload

使用fangfis 上传ftp

    -H, --host [value] FTP host, 默认为localhost
    -u, --user [value] FTP user, 默认为anonymous
    -p, --pass [value] FTP password, 默认为anonymous@
    -o, --output [value] FTP 上传目标路径,相对FTP根路径, 默认为./static
    -i, --input [value] FTP 上传源路径路径,相对本地路径, 默认为./static
    -t, --type [value] FTP连接类型,一般分为测试和正式. 默认为default
    -P, --port [value] FTP 端口, 默认为21
    -T, --idleTimeout [value] FTP连接超时时间, 默认100
    -m, --maxConnections [value] FTP最大连接数. 默认为5

fangfis update

升级fangfis后,在项目根目录使用,用于更新相关依赖

Usage no npm install needed!

README

安装

使用

构建配置

fangfis build

fangfis upload

fangfis update