webpack-问题记录

1.为什么我们在写前端代码的时候,可以使用 process.env.NODE_ENV 这样的代码(process 不是 node 模块么?为啥可以在浏览器下使用)?

因为webpack有DefinePlugin的存在,在初始模板的时候,注入了全局process对象,所以浏览器可以用process对象。

2.为什么我们在写前端代码的时候,可以使用诸如 Buffer、setImmediate 等 node 才有的全局对象(https://nodejs.org/api/globals.html#globals_clearimmediate_immediateobject)

Buffer其实都是基于typedArray实现的,v8是支持typedArray的。在浏览器中使用Buffer、setImmediate,只需要引入polyfill。

3.如果代码中出现了 if (process.env.NODE_ENV === 'development') { // do something },在 production build 的代码里面,会有这段代码么,为什么?

打包的时候,这段代码会被优化掉。因为在编译的时候,这段代码就类似于 if(false) {},webpack在编译的时候会对 if(false === false){} 或者 if (true === true){} 类似的代码做标记,然后terser会删掉这段逻辑。同样,在代码压缩minify的时候,也会把类似if ('a'=== 'a'){} 这些逻辑优化掉。

4.axios 同时支持了 node 和 browser 环境,是怎么支持的?打包的时候,两个环境的代码都会打包进去么?

axios源码里面,有xhrAdapter和httpAdater,通过判断当前是浏览器环境还是node环境,来决定使用哪个adapter。打包的时候,也只会把当前环境的adapter打包进去。

 

 

 

發表評論
所有評論
還沒有人評論,想成為第一個評論的人麼? 請在上方評論欄輸入並且點擊發布.
相關文章