1、问题起因
A项目传统项目,调用第三方提供的方法,实现了签名功能(主要是因为签名资质),项目B是vue-ci3+webpack。项目B需要实现新功能,也用到签名,把签名代码集成了过来。调用第三方接口失败,各种排查问题。最后定位到问题在于,调用第三方方法,生成数据包的时候,数据包解析出来多了几个Null。
最后把第三方公司提供的demo整个放进项目文件夹也不行,最终确认不是代码问题,可能跟vue-cli3+webpack有问题,也就是第三方提供的库,跟webpack不兼容。页面功能实现在page下面,会经过webpack打包,可能影响了第三方公司提供的js包,在调用生成数据包的方法适合,莫名其妙多了几个null,要被坑惨了。
2、解决办法
把这个功能拆分出来,放在public文件夹下面。
cli3官方说明:
任何放置在public文件夹下的静态资源都会被简单的复制,而不经过webpack,需要使用绝对路径,来引用他们.
public目录提供的是一个应急手段,通过绝对路径引用他的时候,留意应用会部署到哪里,如果没有部署到域名的根目录,需要为url配置publicPath前缀
什么时候使用public
有些库跟webpack不兼容,只能写在public文件夹下面,用一个独立的 <script> 标签引入没有别的选择、
需要在构建输出中指定一个文件的名字
有上千个图片,需要通过动态引用他们的路径