关于js module系统的一些笔记
栏目: JavaScript · 发布时间: 6年前
内容简介：最近写完一个基于sao的模板再把之前写的一些代码弄到github上，在项目中使用时遇到需要兼容IE的情况才发现webpack在加载文件时存在一定策略，下面来简单说一下。先看一下这个例子的文件和pkg的设置
起因
最近写完一个基于sao的模板再把之前写的一些代码弄到github上，在项目中使用时遇到需要兼容IE的情况才发现webpack在加载文件时存在一定策略，下面来简单说一下。
例子
先看一下这个例子的文件和pkg的设置
dist/
vpin.esm.js #ES2015格式
vpin.min.js #UMD格式
vpin.js #Commonjs格式
package.js
文件设置如下
{
"main": "vpin.js",
"jsnext:main": "vpin.esm.js",
"module": "vpin.esm.js",
"browser": "vpin.min.js"
}
在项目中用webpack加载时这个例子时，会优先加载browser设置的文件，然后才是module或者jsnext:main，最后才是main。
不知道为何用rollup生成的UMD在webpack引入后无法命中 exports
关键字，导致引入空内容。
由于上面问题导致我困惑很久，后来根据webpack加载策略，把 browser
设置去掉后加载esm方式的文件就把问题解决了。
如果你也有把项目发布至npm，那么请留意一下 package.json
相关设置，能避免不必要的麻烦。
参考资料
- JavaScript Module Systems Showdown: CommonJS vs AMD vs ES2015 分析三种JS Module的设计因由
- Webpack 4 不完全迁移指北 提及webpack模块类型相关内容
- webpack 4 compatibility issue
以上就是本文的全部内容，希望对大家的学习有所帮助，也希望大家多多支持 码农网
猜你喜欢:
本站部分资源来源于网络，本站转载出于传递更多信息之目的，版权归原作者或者来源机构所有，如转载稿涉及版权问题，请联系我们。
程序员的数学思维修炼（趣味解读）
周颖 / 清华大学出版社 / 2014-4-1 / 45.00元
本书是一本专门为程序员而写的数学书，介绍了程序设计中常用的数学知识。本书门槛不高，不需要读者精通很多高深的数学知识，只需要读者具备基本的四则运算、乘方等数学基础知识和日常生活中的基本逻辑判断能力即可。本书拒绝枯燥乏味的讲解，而是代之以轻松活泼的风格。书中列举了大量读者都很熟悉，而且非常有趣的数学实例，并结合程序设计的思维和算法加以剖析，可以训练读者的数学思维能力和程序设计能力，进而拓宽读者的视野，......一起来看看 《程序员的数学思维修炼（趣味解读）》 这本书的介绍吧!
