本文作者：IMWeb 黎清龙 原文出处：IMWeb社区 未经同意，禁止转载 fis3 新特性应用 1 前言 fis3相比fis2，核心思路并没有改变 还是围绕3个核心做处理： 资源嵌入 资源定位...fis3相对于fis2来说，用户更容易使用，给插件开发者提供更多的能力 这主要体现于以下两点： 类似css的覆盖式配置方式，不需要用命令行参数来进行配置 提供许多事件锚点 这篇文章主要介绍的就是第2点，...讲解fis3提供的特殊事件，及其作用。...都会先抛出一个事件 这些节点的意义也非常深远，甚至可以改变fis3的compile流程，同样笔者也举两个例子 4.1 不需要两个插件！...后续 可以看到，fis3最重大的改进就是提供了更多的想象空间给插件开发者 合理利用这些特性，我们可以在fis3的环境下做许多事情 但就只有这些吗？ No！还有另外一些更加有趣更加开放的特性还没介绍。
一、安装 安装初始化 npm i -g fis3 fis3 -v fis3 init 二、配置 类似Gruntfile.js或Gulpfile.js，新建fis-config.js文件 配置api介绍如下...这是 fis3 中的一个重要概念，其意味着有多份配置，每一份配置都可以让 fis3 进行不同的编译； fis.media('dev').match('*.js', { optimizer: null...1、开启server到内置server调试目录 fis3 server open 2、发布到内置server发布目录 fis3 release 3、文件监听 fis3 release -w //FIS3...构建流程 FIS3 是基于文件对象进行构建的，每个进入 FIS3 的文件都会实例化成一个 File 对象，整个构建过程都对这个对象进行操作完成构建任务。...: fis3 release [-d path] //发布目录 fis3 install 插件名 //安装一个插件 fis3 init //初始化一个项目 fis3
本文作者：IMWeb 袁飞翔 原文出处：IMWeb社区 未经同意，禁止转载 首先看一个有趣的问题 // fis-conf.js fis.hook('c...
本文作者：IMWeb ouven 原文出处：IMWeb社区 未经同意，禁止转载 一、安装 安装初始化 npm i -g fis3 fis3 -v fis3 init 二、配置 类似Gruntfile.js...这是 fis3 中的一个重要概念，其意味着有多份配置，每一份配置都可以让 fis3 进行不同的编译； fis.media('dev').match('*.js', { optimizer: null...1、开启server到内置server调试目录 fis3 server open 2、发布到内置server发布目录 fis3 release 3、文件监听 fis3 release -w //FIS3...构建流程 FIS3 是基于文件对象进行构建的，每个进入 FIS3 的文件都会实例化成一个 File 对象，整个构建过程都对这个对象进行操作完成构建任务。...: fis3 release [-d path] //发布目录 fis3 install 插件名 //安装一个插件 fis3 init //初始化一个项目 fis3
Fis3构建工具 Fis3的安装 npm install -g fis3 查看fis3 fis3 –v fi3构建工具新建文件夹 新建一个根目录 进入根目录输入fis3 init指令初始化 ?...发布以及监听文件 指令：fis3 release –w –d ..../project(project自己建的文件) 建文件夹时，防止递归，加上配置文件 // FIS3 会读取全部项目目录下的资源，如果有些资源不想被构建，通过以下方式排除。...Fis3的配置文件 fis.match('*....绝对路径转化成相对路径的配置文件 fis.hook(‘relative’) fis.match(‘**’,{relative:true}) postcss结合fis3使用 // fis3 的 postcss
本文作者：IMWeb helondeng 原文出处：IMWeb社区 未经同意，禁止转载 目前业务正在逐步迁移到fis3和lego，有许多和业务相关的fis插件需要处理。...参考这里 单元测试 fis3一个很大的优势是提供了单元测试的接口，写完插件后，记得要用单元测试过下，同时这也是一个调试的过程（fis2的调试只能依赖具体的项目）,主体的代码架构是: var fs = require...('fs'), path = require('path'), fis = require('fis3'), _ = fis.util, expect = require
目前业务正在逐步迁移到fis3和lego，有许多和业务相关的fis插件需要处理。...参考这里 单元测试 fis3一个很大的优势是提供了单元测试的接口，写完插件后，记得要用单元测试过下，同时这也是一个调试的过程（fis2的调试只能依赖具体的项目）,主体的代码架构是: var fs = require...('fs'), path = require('path'), fis = require('fis3'), _ = fis.util, expect = require
本文作者：IMWeb 袁飞翔 原文出处：IMWeb社区 未经同意，禁止转载 首先看一个有趣的问题 // fis-conf.js fis.hook('com...
所以，fis3为了解决这个问题，就在fis3中内置了web server 以方便调式查看我们的构建结果。 那问题是我们该如何使用呢？...往下看~ fis3 server open 打开web server根目录 （1）在使用该命令的时候，有一个前提————即，我们在构建项目时，不指定输出目录，即fis3 release -d ..../output 变成了 fis3 release命令； （2）使用fis3 release 构建时，fis3会将构建结果发送到内置的web server根目录下。...fis3内置的web server也是如此。所以，我们无需每次启动一次web server。 fis3 release -w 文件监听 这是文件监听命令。...替代 fis3 内置web server 默认情况下，我们fis3 release 之后，会将构建结果发送到fis3 内置的web server的根目录下。
：npm install -g fis3 命令; mac系统下使用：sudo npm install -g fis3 命令； 安装完成后测试fis3是否安装成功：fis3 -v，若命令行或是mac...: fis3 release -d ....运行fis3 release -d ....以上列出的都是fis3内置的插件，无需安装。...下一次，将会带大家继续fis3的构建之路。
本文主要介绍了如何将一个使用webpack构建的web应用打包为适用于各浏览器的可执行文件。首先介绍了webpack和browserify的区别，然后说明了we...
作者：feix760 首先看一个有趣的问题 // fis-conf.js fis.hook('commonjs') .match('/modules/c...
别急，fis3还有一个强大的功能——在js中嵌入资源。 （2）在js中嵌入资源 前提：__inline()函数，注意是2条短下划线。...a.css'); 编译后，js文件中那串代码变成了： var css="body \n{color:red;\n}"; //假设a.css的内容如下： body{ color:red; } 除了之外，fis3
我们在第一篇中就曾经指出，资源定位是fis3中很重要的特性之一。
举个例子 最近看到有一个gulp-lzmajs的插件，我尝试把它改成fis3插件。 接下来我们要思考下面几个问题 做什么阶段的插件？ lzma库是异步调用的，怎么处理？...第一个问题：fis3把构建分成了三个阶段【编译】【打包】【发布】，当然我们只希望所有文件打包好之后再做js文件的lama压缩，所以做打包阶段的插件，扩展postpackager 第二个问题：我们需要一个很神奇的包
本文作者：IMWeb 黄龙 原文出处：IMWeb社区 未经同意，禁止转载 不清楚fis3是什么的可以先看这个链接 http://fis.baidu.com/ 背景 从fis的官方文档上看，fis...举个例子 最近看到有一个gulp-lzmajs的插件，我尝试把它改成fis3插件。 接下来我们要思考下面几个问题 做什么阶段的插件？ lzma库是异步调用的，怎么处理？...第一个问题：fis3把构建分成了三个阶段【编译】【打包】【发布】，当然我们只希望所有文件打包好之后再做js文件的lama压缩，所以做打包阶段的插件，扩展postpackager 第二个问题：我们需要一个很神奇的包
4 Fis3 Fis3（https://fex.baidu.com/fis3/）是一个来自百度的优秀国产构建工具。...相对于Grunt、Gulp这些只提供了基本功能的工具，Fis3集成了Web开发中的常用构建功能，如下所述。 读写文件：通过fis.match读文件，release配置文件的输出路径。...大致使用如下： 可以看出Fis3很强大，内置了许多功能，无须做太多配置就能完成大量工作。 Fis3的优点是集成了各种Web开发所需的构建功能，配置简单、开箱即用。...Fis3是一种专注于Web开发的完整解决方案，如果将Grunt、Gulp比作汽车的发动机，则可以将Fis3比作一辆完整的汽车。
7:FIS3 https://fex-team.github.io/fis3/ Fis3是来自百度的国产构建工具，相对于grunt，gulp这些只提供了基本功能的工具，Fis3集成了web开发中常用的购将功能
近期把团队的项目构建迁移到fis3，同时把模块加载器也由之前的requirejs切换到了modJS。 有些同学可能不了解modJS，这里做个简单的介绍。 那么，modJS是什么呢？...除了体量非常小之外，modJS配合fis3的fis3-hook-commonjs插件，可以在纯前端项目中实现类似nodejs一样的开发体验。 那么，我们为什么要使用modJS呢？...发布编译时，由构建工具统一添加define包裹，自动添加模块id（默认根据路径生成，也可以在fis3的配置中声明格式）。整体的开发体验更好一些。...一般情况下，modJS配合fis3已经可以满足大部分需求，并且官方还提供了完整支持amd规范的esl-mod.js。
领取专属 10元无门槛券
手把手带您无忧上云
云服务器
即时通信 IM
ICP备案
对象存储
实时音视频
