如何实现无编译无服务器环境下的浏览器端CommonJS模块化？

本文共计4099个文字，预计阅读时间需要17分钟。

目录+引言+1. one-click.js是什么？+2. 打包工具是如何工作的？+3. 我们面临的挑战+3.1. 依赖分析+3.2. 作用域隔离+3.3. 提供模块运行时+4. 总结+引言+日常经常会逛Github，除了star一些极高质量的大牛之外...

目录

• 引言
• 1. one-click.js是什么
• 2. 打包工具是如何工作的？
• 3. 我们面对的挑战
• 3.1. 依赖分析
• 3.2. 作用域隔离
• 3.3. 提供模块运行时
• 4. 总结

引言

平时经常会逛 Github，除了一些 star 极高的大项目外，还会在 Github 上发现很多有意思的小项目。项目或是想法很有趣，或是有不错的技术点，读起来都让人有所收获。所以准备汇总成一个「漫游Github」系列，不定期分享与解读在 Github 上偶遇的有趣项目。本系列重在原理性讲解，而不会深扣源码细节。

好了下面进入正题。本期要介绍的仓库叫one-click.js。

1. one-click.js是什么

one-click.js是个很有意思的库。Github 里是这么介绍它的：

我们知道，如果希望 Commonjs的模块化代码能在浏览器中正常运行，通常都会需要构建/打包工具，例如webpack、rollup 等。