简介
fis3-hook-gfe-amd是一款适用于GFE项目的fis3前端构建工具插件,提供了AMD定义和依赖分析解决方案,可用于优化js打包和加载。本篇文章将提供详细的使用教程和示例代码,帮助你快速上手。
安装
使用npm安装fis3-hook-gfe-amd:
--- ------- ----------------- ----------
配置
在fis-config.js中添加以下代码:
--------------- - ------ --- ------------- ----- --- ------ ------------------------------ --------------- ------------------- ------ ---------------- ------------------ ------------- ------------- --------- ------------------------ ------------- ------------ ------- ---------- -------- ----------------------- ---------- ---
常用配置项
paths
设置前端模块化查找路径别名,可以用来方便地指定模块的路径。若路径有多个,可以按数组规则设置。
--------------- - ------ - --------------------------- ------------- ----------------------- ----------------------------- - ---
shim
模块补丁,将不符合AMD规范的JS文件包装成 AMD规范的函数。示例代码如下:
--------------- - ----- - ------------ - ----- ----------- -------- -------------------- - - ---
ignore
配置不需要进行依赖分析的文件或者文件夹,支持 glob
语法。
--------------- - ------- --------------------- ---------------------- ---
baseUrl
指定模块的基础路径,所有的 module id
都相对于此路径。默认值是 .
。
--------------- - -------- ------------ ---
forwardDeclaration
开启静态资源Loader支持 require('xxx.css', 'insertCss');
。
--------------- - ------------------- ---- ---
globalAsyncAsSync
异步模块当同步模块引入,设置为true,异步模块里面的资源只有在被同步引用的时候才会被加载并且执行。
--------------- - ------------------ ---- ---
packages
模块包配置,如果一个模块id 没有在 paths 中配置,而是符合 'packageName:moduleId'
规则,则按照配置的方式去查找模块路径。
--------------- - --------- - - ----- ---------- --------- ------------------ -- ------- --- ----- ------- -- ---- -------- -- - - ---
config
模块通用配置,可以配置一个通用的模块信息。下面示例定义一个全局的依赖配置。
--------------- - ------- - ----------------- - ----- ---------- - - ---
skipBuiltinModules
忽略内置模块分析。
--------------- - ------------------- ---- ---
示例代码
---- ------ --- ------- -------------------------------------- -------- ------------------- -------- --- - ------------------- ---------- ------------- --- --------- ---- ----------- --- --------------- - ------ - -------------------------- - ---
结尾
本篇文章针对的是使用 fis3
构建工具的前端开发者,如果你的公司或项目也在使用 amd
规范或者 requireJS
框架,那么就可以考虑使用 fis3-hook-gfe-amd
插件,优化你的项目构建效率。
来源:JavaScript中文网 ,转载请联系管理员! 本文地址:https://www.javascriptcn.com/post/60055fc581e8991b448dd2ba