前言
之前做了一个loading的样式组件,为了实现代码的可重用性,将这个小项目打包并且发布在了npm上。在一次次的打包发包过程中经历了一个又一个报错,@buzuosheng/loading
这个组件已经到了2.7.0版本,虽然还有一些要调整的地方,但总算是可以用了。
![085fe9f6f7f2532fc3271c8c38570c5a.png](https://img-blog.csdnimg.cn/img_convert/085fe9f6f7f2532fc3271c8c38570c5a.png)
webpack和rollup对比
webpack算是使用程序员使用最多的打包工具,面试中往往会问到webpack的相关问题,而rollup被问到的要少很多。导致这种现象的一个原因是,「应用开发使用webpack,库开发使用rollup」的说法。
但是两个打包工具都有很强大的插件开发功能,功能差异越来越模糊,但是rollup使用起来更加简洁,而且能打出能小体积的文件。但当我们做前端应用时,性能分析往往要求更小的库,所以rollup更符合开发库的要求。
这次算是一个打包的实验,我们使用两个工具都对这个项目打一次包。
使用webpack打包
在打包之前,需要给package.json
文件中添加或更改一些字段。
{
// 程序主入口模块,用户引用的就是该模块的导出
"main": "dist/bundle.js",