最近入职了新公司,刚接手了新项目,由于没看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打包。