请问老师关于esm模块的大包

来源：1-1 导学（不看错过1个亿）

hy_wang

2021-09-19

老师重新开一个问题哈，上一个问题你可以没有明白我的意思。

图片描述

老师这个是我安装antd后的，咱们平常业务引用她就是
import { Button } from antd
老师我的疑问就是，咱们平常这样引入走的是esm的方式。而在node_modules引入的antd也是esm的方式进行的编写。

当我们进行项目build的时候，其实es的模块肯定是会被编译的。但是我们并不会编译antd的这些esm代码。此时我有点疑问，既然编译后antd中的模块仍然还是export的方法。那我们引用它不应该报错了吗。

因为按照我的理解，babel-loader其实在新版默认已经不会处理node_modules中的内容了。

但是老师我发现node_modules antd的button.js中也存在import xxx from 'xxx'的代码。我还是不太明白

写回答

1回答

张轩

2021-09-21

已采纳

同学你好

我再次理解一下你的意思

当我们进行项目build的时候，其实es的模块肯定是会被编译的。但是我们并不会编译antd的这些esm代码。

你说的 build 编译，我认为可以是 webpack 以及 rollup 的 build 过程，它们是会编译 esm 代码的，它们会将整个入口文件进行分析，按照你打包的目的（普通的还是要打包成 library）生成最后的代码。一般是一个或者几个 js 文件。

babel 不是打包工具，它是 compiler，它做的是将高级（ESnext）的js 转换成兼容性的代码（ES5），所以它仅仅是打包的一个环节（babel-loader），而且并不是必须的。

hy_wang

非常感谢！

2021-09-22

共1条回复

React18+TS高仿AntD从零到一打造组件库

设计，开发，测试，发布再到 CI/CD，从0到1造轮子

2145 学习 · 959 问题

相似问题

回答 1

回答 1

回答 1

回答 2

回答 1