npm yarn cnpm 打包区别

最近入职了新公司，刚接手了新项目，由于没看README.md（这不应该），习惯性的用了npm安装依赖。

相同的代码，我打的包上测试环境会报错，同事打的生产包却能正常运行。

跟据报错，找到了对应的代码，发现原来代码里的语法确实存问题，但为什么我报错，同事的就不报错。

突然灵光一闪，想起以前同事用cnpm安的依赖能正常跑，我npm装的依赖报错。

同时又想起自己没看README.md，马上点开README.md，如然没用不是用npm安装依赖，用的是yarn。

然后，自己用yarn重新打了个包，发现也没报错，果然yarn打的包，自动“修复”了语法错误的代码。

下面，我把npm打包，生成的代码，对yarn打包生成的代码对比了一下。

发现生成的代码确实不一样。直接上图了。。。

npm打的测试包

yarn打的测试包

npm打的生产包

yarn打的生产包

测试环境报错

源码

另外，对比了一下，npm安装依赖包的数量是784，而安装依赖包的数量是814。

后续博主有空会深入的去研究下，造成两种方式打包的结果不一样的具体原因，如果有小伙伴知道的，可以私信下我哈！

最后提一下之前遇到同事cnpm安装依没报错，当是的场境是这样的，父组件的数组传进子组件，在子组件里修改了父组件传进来的那个数组。

而我拉了他的代码后就报错了，最后也是定位到是cnpm的问题，后面让同事改了他的语法，并用npm重新安装依赖。

而我现在的这家公司，因为他们之前一直用的是yarn，如果要求改为npm，可能会有其它问题，所以这个项目，我还是和他们保持一至，用yarn。
 

总结

npm打的包，因为baseSetting[1] 是普能的数据类型，不是具有iterable，所以报错，
而用yarn打的包，因为用的是concat，将对象和数组拼接得到新的数据，不小心"修复"了这个问题，
明显，yarn的打包方式改变了源码真实的意图（虽然源码是有问题的），虽然这次误打正着，
但保不确，将来不会有什么意想不到的问题发生，所以建议试用npm打包。