安装插件:

npm install -g fis-parser-less
npm install -g fis3-postpackager-loader

配置:fis-conf.js

使用fis-parser-less 插件进行解析,.less 文件后缀构建后被改成 .css 文件

fis.match('*.less', {
parser: fis.plugin('less'),
rExt: '.css'
})

less的打包:

//less转换为css
fis.match('*.less', {
parser: fis.plugin('less'),
rExt: '.css'
}); //将less转换出来的css与其他css合并
fis.match('*.{less,css}', {
packTo: '/static/aio.css'
});

比较粗暴的做法:给 loader 插件配置 allInOne 属性,那就是全部css合并为一个,不用指定packTo

fis.match('::package', {
postpackager: fis.plugin('loader', {
allInOne: true
})
}); //将less解析为css
fis.match('*.less', {
parser: fis.plugin('less'),
rExt: '.css'
});

FIS3中使用less的更多相关文章

  1. FIS3的简单使用

    序言: 最近在收集前端的优化工具,随便一搜,厉害了word哥,有grunt.gulp.FIS3.webpack等等,简直就是眼花缭乱!前辈们对于他们的评价各有千秋,于是乎就想每个都来用一遍(之前已经倒 ...

  2. 前端构建工具-fis3使用入门

    FIS3 是面向前端的工程构建工具.解决前端工程中性能优化.资源加载(异步.同步.按需.预加载.依赖管理.合并.内嵌).模块化开发.自动化工具.开发规范.代码部署等问题. 官网地址是: https:/ ...

  3. ES6-fetch

    fetch 事实标准,并不存在与ES6规范中,基于Promise实现. 目前项目中对Promise的兼容性尚存在问题,如果在项目中应用fetch,需要引入es6-promise和fetch. fis3 ...

  4. 如何使用Less?

    LESS是动态样式语言,赋予CSS动态语言的特性,如变量.继承.运算.函数,使得CSS更方便编写与维护.>>官网 less @color:#ff0000; body{color:@colo ...

  5. Python开源框架

    info:更多Django信息url:https://www.oschina.net/p/djangodetail: Django 是 Python 编程语言驱动的一个开源模型-视图-控制器(MVC) ...

  6. fis3打包中的一些注意事项

    1.在html文件中,如果在标签的style属性内添加路径,fis不会识别改路径并打包,如 2.fis主要针对静态文件进行打包.对其他文件打包会出现一些问题. 比如jsp页面.下面的例子script. ...

  7. Fis3前端工程化之项目实战

    Fis3项目 项目目录结构: E:. │ .gitignore │ fis-conf.js │ index.html │ package.json │ README.md │ ├─material │ ...

  8. Fis3的前端工程化之路[三大特性篇之声明依赖]

    Fis3版本:v3.4.22 Fis3的三大特性 资源定位:获取任何开发中所使用资源的线上路径 内容嵌入:把一个文件的内容(文本)或者base64编码(图片)嵌入到另一个文件中 依赖声明:在一个文本文 ...

  9. Fis3的前端工程化之路[三大特性篇之资源定位]

    Fis3版本:v3.4.22 Fis3的三大特性 资源定位:获取任何开发中所使用资源的线上路径 内容嵌入:把一个文件的内容(文本)或者base64编码(图片)嵌入到另一个文件中 依赖声明:在一个文本文 ...

随机推荐

  1. mini_httpd在RedHat 5下安装

    1.安装mini_httpdcd /usr/src/redhat/SOURCES wget http://www.acme.com/software/mini_httpd/mini_httpd-1.1 ...

  2. 关于真多核和加多核&线程由哪几部分组成

    网上查的资料小结,没有考证. 真多核是指一个cpu多个核心,即多个内核. 假多核是指多个cpu捆绑形成的分布式计算,ARM针对服务器市场推出的处理器为多个cpu的 真多核的应用奔腾和因特尔 双核芯cp ...

  3. python中的any和all函数

    any和all函数是判断一组数据真假性的综合结果.以下摘选自Stackoverflow. ------------------ 分割线开始 ----------------- any any will ...

  4. 实现celery中出现拥挤队列时,及时发邮件通知

    里面有几个常用的功能,以后值得借鉴. 如获取脚本目录,IP,获取shell返回值,发送邮件等.. 上午写完,中午测试,下午上线~~ #!/usr/bin/env python # -*- coding ...

  5. android 代码设置、打开wifi热点及热点的连接(转)

      用过快牙的朋友应该知道它们在两天设备之间传输文件的时候使用的是wifi热点,然后另一台便连接这个热点再进行传输.快牙传输速度惊人应该跟它的这种机制有关系吧.不知道它的搜索机制是怎样的,但我想应该可 ...

  6. 寻找并输出11~999之间的回文数m

    寻找并输出11~999之间的数m,它满足m.m2和m3均为回文数. 回文:各位数字左右对称的整数. 例如:11满足上述条件 112=121,113=1331 判断一个数是否是回文数的方法:求该数的反序 ...

  7. plan-6.17周末

    喷完了自己,浑身舒爽. 搞个计划,最近要学东西,以提交博客为准,提交了才认为ok. 1.python的新书<<Fluent python>>不错,老的python资料已经满足不 ...

  8. 开发 ASP.NET vNext 初步总结(使用Visual Studio 2015 Preview )

    新特性: vNext又称MVC 6.0,不再需要依赖System.Web,占用的内存大大减少(从前无论是多么简单的一个请求,System.Web本身就要占用31KB内存). 可以self-host模式 ...

  9. React篇章-React 组件

    <!DOCTYPE html> <html> <head> <meta charset="UTF-8" /> <title&g ...

  10. 【我要学python】函数的系统学习

    我的短期目标:python+CTF reverse 一起加油! #1,函数介绍 1,功能性 函数目的 2,隐藏性 (封装) (避免写重复代码) 例: #round为保留小数的函数 a = 3.1415 ...