大部分来自    https://github.com/yanhaijing/fis3-base  里的原生配置, 新增部分为舍弃了fis3的component 换为node_modules, 去掉了一些自己不怎么用的功能

// 设置项目属性
fis.set('project.name', 'fis3-base');
fis.set('project.static', '/static');
fis.set('project.files', ['*.html', 'map.json', '/test/*']);// 引入模块化开发插件,设置规范为 commonJs 规范。fis.hook('commonjs', {baseUrl: './modules',extList: ['.js', '.es']
});// 不使用fis3的component 使用插件fis3-hook-node_modules把插件依赖转为node_modules
fis.unhook('components')
fis.hook('node_modules')fis.match('/{node_modules}/**.js', {isMod: true,useSameNameRequire: true
});/*************************目录规范*****************************/// 开启同名依赖, 同名模板依赖nui同名js跟css
fis.match('/modules/**', {useSameNameRequire: true
});// ------ 全局配置
// 允许你在 js 中直接 require css+文件
fis.match('*.{js,es}', {preprocessor: [fis.plugin('js-require-file'),fis.plugin('js-require-css', {mode: 'dependency'})]
});// 配置图片压缩
fis.match('**.png', {optimizer: fis.plugin('png-compressor', {type: 'pngquant'})
});// ------ 配置lib
fis.match('/lib/**.js', {release: '${project.static}/$&'
});// ------ 配置modules
fis.match('/modules/(**)', {release: '${project.static}/$1'
})// 配置css
//fis.match(/^\/modules\/(.*\.scss)$/i, {
//  parser: fis.plugin('sass', {
//      include_paths: ['modules/css', 'components'] // 加入文件查找目录
//  })
//});
fis.match(/^\/modules\/(.*\.less)$/i, {parser: fis.plugin('less', {paths: []})
});
fis.match(/^\/modules\/(.*\.(scss|less|css))$/i, {rExt: '.css',isMod: true,release: '${project.static}/$1',postprocessor: fis.plugin('autoprefixer', {browsers: ['IE >= 8', 'Chrome >= 30', 'last 2 versions'] // pc// browsers: ['Android >= 4', 'ChromeAndroid > 1%', 'iOS >= 6'] // wap})
});
fis.match(/^\/modules\/(.*\.(?:png|jpg|gif))$/i, {release: '${project.static}/$1'
});// 配置js
fis.match(/^\/modules\/(.*\.js)$/i, {parser: fis.plugin('babel-5.x'),rExt: 'js',isMod: true,release: '${project.static}/$1'
});
fis.match(/^\/modules\/(.*\.js)$/i, {isMod: true,release: '${project.static}/$1'
});// ------ 配置前端模版 使用template.js
//fis.match('**.tmpl', {
//  parser: fis.plugin('template', {
//      sTag: '<#',
//      eTag: '#>',
//      global: 'template'
//  }),
//  isJsLike: true,
//  release: false
//});// ------ 配置模拟数据
fis.match('/test/**', {release: '$0'
});
fis.match('/test/server.conf', {release: '/config/server.conf'
});/*************************打包规范*****************************/// 因为是纯前端项目,依赖不能自断被加载进来,所以这里需要借助一个 loader 来完成,
// 注意:与后端结合的项目不需要此插件!!!
fis.match('::package', {// npm install [-g] fis3-postpackager-loader// 分析 __RESOURCE_MAP__ 结构,来解决资源加载问题postpackager: fis.plugin('loader', {resourceType: 'commonJs',useInlineMap: true // 资源映射表内嵌})
});// debug后缀 不会压缩
var map = {'rd': { // 项目发布到指定机器host: '',path: ''},'rd-debug': { // 查看发布到指定机器的项目的情况(无压缩版本)host: '',path: ''},'prod': {  // 发布项目host: '',path: '/${project.name}'},'prod-debug': {  //查看发布项目的情况(无压缩版本)host: '',path: ''}
};// 通用 1.替换url前缀 2.添加mr5码 3.打包 4.合图 5.重新定义资源路径
Object.keys(map).forEach(function(v) {var o = map[v];var domain = o.host + o.path;fis.media(v).match('**.{es,js}', {useHash: true,domain: domain}).match('**.{scss,less,css}', {useSprite: true,useHash: true,domain: domain}).match('::image', {useHash: true,domain: domain}).match('**/(*_{x,y,z}.png)', {release: '/pkg/$1'})// 启用打包插件,必须匹配 ::package.match('::package', {spriter: fis.plugin('csssprites', {layout: 'matrix',// scale: 0.5, // 移动端二倍图用margin: '10'}),postpackager: fis.plugin('loader', {allInOne: true,})}).match('/lib/es5-{shim,sham}.js', {packTo: '/pkg/es5-shim.js'}).match('/components/**.css', {packTo: '/pkg/components.css'}).match('/components/**.js', {packTo: '/pkg/components.js'}).match('/modules/**.{scss,less,css}', {packTo: '/pkg/modules.css'}).match('/modules/css/**.{scss,less,css}', {packTo: ''}).match('/modules/css/common.scss', {packTo: '/pkg/common.css'}).match('/modules/**.{es,js}', {packTo: '/pkg/modules.js'}).match('/modules/app/**.{es,js}', {packTo: '/pkg/aio.js'})// 为了上线方便,将静态文件发布到同一个目录// .match('**/(*.{css,less,scss,es,js,jpg,png,gif})', {//     release: '/prod/$1'// })
});// 压缩css js html
Object.keys(map).filter(function(v) {return v.indexOf('debug') < 0}).forEach(function(v) {fis.media(v).match('**.{es,js}', {optimizer: fis.plugin('uglify-js')}).match('**.{scss,less,css}', {optimizer: fis.plugin('clean-css', {'keepBreaks': true //保持一个规则一个换行})});});// 本地产出发布
fis.media('prod').match('**', {deploy: [fis.plugin('skip-packed', {// 默认被打包了 js 和 css 以及被 css sprite 合并了的图片都会在这过滤掉,// 但是如果这些文件满足下面的规则,则依然不过滤ignore: []}),fis.plugin('local-deliver', {to: 'output'})]});// 发布到指定的机器
//['rd', 'rd-debug'].forEach(function(v) {
//  fis.media(v)
//      .match('*', {
//          deploy: [
//              fis.plugin('skip-packed', {
//                  // 默认被打包了 js 和 css 以及被 css sprite 合并了的图片都会在这过滤掉,
//                  // 但是如果这些文件满足下面的规则,则依然不过滤
//                  ignore: []
//              }),
//              fis.plugin('http-push', {
//                  receiver: 'xxx/fisreceiver.php',
//                  to: 'xxx/' + fis.get('project.name')
//              })
//          ]
//      });
//});

  

package.json

{"name": "","version": "","description": "","repository": {"type": "git","url": ""},"devDependencies": {"fis-parser-babel-5.x": "^1.4.0","fis-parser-less": "^0.1.3","fis-parser-template": "^0.3.3","fis-postprocessor-autoprefixer": "0.0.5","fis3-deploy-skip-packed": "0.0.5","fis3-hook-commonjs": "^0.1.26","fis3-hook-node_modules": "^2.2.8","fis3-postpackager-loader": "^2.1.4","fis3-postprocessor-autoprefixer": "^1.0.0","fis3-preprocessor-js-require-css": "^0.1.1","fis3-preprocessor-js-require-file": "^0.1.3"}
}

  

转载于:https://www.cnblogs.com/yosoro/p/7435359.html

fis3配置(附package.json)相关推荐

  1. 前端学习(2143):webpack的config.js配置和package.json

  2. node中模板引擎、模块导出、package.json简介

    在node.js中使用引擎模板: art-template不仅在浏览器可以使用,也可以在node中使用,并且模板引擎起早诞生于服务器领域,在node中使用模板引擎: 1.安装:在一个文件目录下执行命令 ...

  3. webpack:package.json中scripts的作用

    webpack:package.json中scripts的作用 为了在执行命令的时候输入太长的命令,我们可以将要执行的命令配置到 package.json的scripts中,因为scripts中配置可 ...

  4. 用package.json配置NodeJS项目的模块声明

    在NodeJS项目中,用package.json文件来声明项目中使用的模块,这样在新的环境部署时,只要在package.json文件所在的目录执行 npm install 命令即可安装所需要的模块. ...

  5. 配置根目录_npm配置文件package.json里面的字段你知道多少

    嗨!新的一天get点什么功能呢?来聊聊npm的配置文件吧! 创建一个前端项目目前都离不开npm包管理工具,所以根目录必须有一个package.json文件 如何创建呢? 1)懒人操作:项目根目录直接黑 ...

  6. android中json插件,【Android原生插件】package.json中关于第三方aar的配置

    按照文档(https://ask.dcloud.net.cn/article/35414)所说: dependencies节点特殊说明 android插件中集成的第三方SDK 如果是jar或so放入到 ...

  7. 【前端工程化】配置package.json中scripts命令脚本,新手必学

    每日鸡汤:你总要努力追上那个曾经被赋予众望的自己吧 目录 前言 一.运行npm run 命令之后会干啥? 1. scripts里面写啥 2. node_modules/.bin 二进制可执行文件 二. ...

  8. nodejs的package.json配置参数

    一直对node设置package.json的参数不甚了解,借着vscode工具的注释,我把package.json中的options全部展示一下,中文注释部分可能不是package.json里的配置参 ...

  9. vue cli3 热更新 保存时自动刷新页面内容 + 分离环境变量.env package.json配置

    前几天ts+vue3.0+view-design撸了一个项目,然后总感觉哪里不对劲,今天终于醒悟了原来是热更新没开 在vue.config.js中配置以下选项 const IS_PRO = ['pro ...

最新文章

  1. SAP MM MIGO Cancellation可以用于冲销上次冲销而产生的物料凭证
  2. 中兴交换机查看光纤板支持的类型
  3. codeforces 712 Memory and De-Evolution
  4. 小米Android N新功能,快升级牛轧糖 小米Android N支持汇总
  5. 《剑指offer》-- 和为S的连续整数序列、和为S的两个数字、左旋转字符串、翻转单词顺序列
  6. linux 头文件汇总
  7. 天津大学计算机专业怎么样,请问天大计算机专业的研究生怎么样啊?
  8. 离线安装.net4.032位_怎样在断网的情况下安装IE11
  9. 极化码理论及算法研究6-SCL、CA-SCL及matlab仿真
  10. ICC II 2 placement
  11. 完全免费的Windows代码签名证书(大神勿喷)
  12. Transformer详解
  13. 今天我们聊一聊程序员怎么进国企,附上我的2021年国企面经一份,希望对大家有帮助!
  14. 【190411】VC++ 双摄像头视频监控捕捉程序源代码
  15. ~!#¥%……*()——+|
  16. 数据分析让网络推广事半功倍
  17. 一个事物两个方面的对比举例_对比属于修辞手法吗
  18. Eclipse 字体不一致问题
  19. 【网络教程】有道词典总是提示网络连接错误怎么办
  20. 项目管理十大知识领域和五大过程(内功心法)

热门文章

  1. CentOS登录过程
  2. 电脑MAC(物理地址)修改方法
  3. TSPL指令二维码打印无效?我搜集的TSPL中文文档
  4. Rational Test Suite-Purify
  5. Python编程:使用textrank4zh、jieba、snownlp提取中文文章关键字和摘要
  6. 疫情防控社区门禁系统
  7. 刘光《C++程序员不可不知的101条实用经验》
  8. 脱不花.怎样成为高效学习的人
  9. 差示光谱法的测定原理_差示扫描量热法(DSC)测量物质的纯度的方法 第1部分 原理及实验方法...
  10. 《关于举办2021年合肥市青少年信息学科普日活动的通知》