用于自动加载模块化资源的FIS插件
用于自动加载模块化资源的FIS插件
功能 将当前页面的所有资源依赖自动注入页面中， 功能特点 无需手工维护<script src="path"></script> 或 <link rel="stylesheet" href="path"> 标签引用资源，页面依赖的资源会自动加载，实现像写Node.js程序一样编写前端页面。
与fis-postprocessor-require-async插件结合，支持modjs的require.async异步加载功能
使modjs脱离后端静态资源管理依赖，使用成本更低，配合fis-postpackager-simple插件，轻松优化页面性能。
支持amd脱离后端静态资源管理，轻松加载AMD资源。
自定义输出
插件默认会将引用的资源添加至head标签结尾，如果需要定制位置，可以通过在页面中注入占位符来满足需求
<!doctype html> <html> <head> <meta charset="utf-8"> <!--STYLE_PLACEHOLDER--> </head> <body> <div class="main"></div> <!--SCRIPT_PLACEHOLDER--> <!--RESOURCEMAP_PLACEHOLDER--> <script type="text/javascript"> require('main'); </script> </body> </html>
目前支持三种占位符
<!--SCRIPT_PLACEHOLDER--> 用于指定脚本输出位置
<!--RESOURCEMAP_PLACEHOLDER--> 用于指定异步脚本资源表输出位置，需要在mod.js引用后，异步请求前输出
<!--STYLE_PLACEHOLDER--> 用于指定样式输出位置
用法
$ npm install -g fis-postpackager-autoload
$ vi path/to/project/fis-conf.js
// file : path/to/project/fis-conf.js fis.config.set('modules.postpackager', 'autoload'); // 添加combine插件，自动应用pack配置，打包零散资源 //fis.config.set('modules.postpackager', 'autoload, simple'); // useSiteMap设置使用整站/页面异步资源表配置，默认为false fis.config.set('settings.postpackager.autoload.useSiteMap', true); // useInlineMap设置内联resourceMap还是异步加载resourceMap，默认为false fis.config.set('settings.postpackager.autoload.useInlineMap', true); //通过include属性将额外的资源增加入resourceMap中 fis.config.set('settings.postpackager.autoload.include', /^\/somepath\//i); // 设置占位符 fis.config.set('settings.postpackager.autoload.scriptTag', '<!--SCRIPT_PLACEHOLDER-->'); fis.config.set('settings.postpackager.autoload.styleTag', '<!--STYLE_PLACEHOLDER-->'); fis.config.set('settings.postpackager.autoload.resourceMapTag', '<!--RESOURCEMAP_PLACEHOLDER-->'); // 开启AMD模式 fis.config.set('settings.postpackager.autoload.type', 'requirejs'); // 美化resourceMap，即使开启压缩，也不会压缩resourceMap fis.config.set('settings.postpackager.autoload.beautyResourceMap', true); DEMO
modjs-autoload-demo
版权声明：
1、该文章(资料)来源于互联网公开信息，我方只是对该内容做点评，所分享的下载地址为原作者公开地址。2、网站不提供资料下载，如需下载请到原作者页面进行下载。
