示例代码 假设我们有两个模块：一个 ESM 格式和一个 CommonJS 格式： math.js (CommonJS) index.js (ESM) 使用 Webpack 编译后的代码 Webpack

本篇文章来聊一下 ts 项目中的一个大坑，esm 模块依赖问题。整理一下我从头到尾遇到的所有问题，来把平时接触到关于 node 模块化方案的零碎知识点串联起来，希望可以让大家少走弯路。

说多了都是泪... 在 2015 年 10 月 29 号，Sebastian McKenzie、James Kyle 以及 Babel 团队的其他成员，发布了一个面向各地前端开发者的大型版本：Babel 6.0.0。太棒了，因为它不再是一个转译器，而是一个可插拔的 JavaSc…

持续创作，加速成长！这是我参与「掘金日新计划 · 6 月更文挑战」的第3天，点击查看活动详情 简介 webpack官方有标准的说法：Tree-shaking的本质是消除无用的js代码。无用代码消除在广

这篇文章不涉及 Webpack 的原理，只是观察下 Webpack 对 commonjs 和 esmodule 模块打包后的产物，读完后会对模块系统有个更深的了解。

现在的很多前端开发者，不管是出于代码可读性、代码简洁性还是其他可能存在炫技成分的原因，在编写 JS 代码时都喜欢用上最新的 ECMAScript 语法。但大多数的项目都还是会选择通过 babel

一. 什么是Tree-shaking 上图形象的解释了Tree-shaking 的本意，本文所说的前端中的tree-shaking可以理解为通过工具"摇"我们的JS文件，将其中用不到的代码"摇"掉，是一个性能优化的范畴。具体来说，在 webpack 项目中，有一个入口文件，相当…

一、什么是 Tree Shaking Tree-Shaking 是一种基于 ES Module 规范的 Dead Code Elimination 技术，它会在运行过程中静态分析模块之间的导入导出，确

通过本文你可以学到什么：webpack对模块化语法的支持、打包后模块的链接执行、动态加载模块的处理流程，以及可能涉及到的诸多知识点等待你的发掘。提示：有些讲解放到了注释里，注意结合一起看。 目前前端工程通过webpack的构建，支持ESModule和CommonJs的写法，达到…