基于 webpack 的 SPA 单页 Web 应用 动态加载插件的机制

我们拿它做什么用

实现可插拔的插件机制。

我们如何做到

由于在webpack的传统模式下是将所有模块都打包到同一文件或者同一系列文件，也就是说它所有模块必须做关联打包，进而无法实现可插拔的注入，也就无法实现插件的开启和关闭。

因此我们的实现方式是：

1.将模块功能以umd模块的方式用webpack打包出来。

  1. umd模块单文件用script加载到浏览器后。
  2. 接着会在window对象上附加一个自身的对象。
  3. 这样就可以在任意地方获取到这个对象，然后进行模块或功能注入。

Notadd相关代码参考：
https://github.com/notadd/administration/tree/master/resources/mixes/administration/src

项目主页：欢迎star

https://github.com/notadd/notadd

最后编辑于 ：
©著作权归作者所有,转载或内容合作请联系作者
【社区内容提示】社区部分内容疑似由AI辅助生成，浏览时请结合常识与多方信息审慎甄别。
平台声明：文章内容（如有图片或视频亦包括在内）由作者上传并发布，文章内容仅代表作者本人观点，简书系信息发布平台，仅提供信息存储服务。

相关阅读更多精彩内容

  • webpack 从入门到工程实践
    GitChat技术杂谈 前言 本文较长，为了节省你的阅读时间，在文前列写作思路如下： 什么是 webpack，它要...
    萧玄辞阅读 12,927评论 7赞 110
  • 你一定喜欢看的 Webpack 2.× 入门实战
    最近在学习 Webpack,网上大多数入门教程都是基于 Webpack 1.x 版本的,我学习 Webpack 的...
    My_Oh_My阅读 8,348评论 40赞 247
  • Android - 收藏集
    Android 自定义View的各种姿势1 Activity的显示之ViewRootImpl详解 Activity...
    passiontim阅读 179,540评论 25赞 708
  • webpack教程
    无意中看到zhangwnag大佬分享的webpack教程感觉受益匪浅，特此分享以备自己日后查看，也希望更多的人看到...
    小小字符阅读 8,390评论 7赞 35
  • 客（用）户在这里
    财经社区：雪球代表，其他理财基金。。 csdn呢？ 国外的程序员社区、虚拟币社区、区块链社区，ico社区呢？ 这是...
    中阳阅读 91评论 0赞 0

友情链接更多精彩内容