教你将「uniApp」中h5项目迁移上线包(第二部分)(构建压缩包腾讯第二部分核心)

接着上一篇的内容，上一篇提到为什么会采用这个技术方案的原因了。
那么这篇文章来具体提一提这里面的每个核心的技术 fs + path + zip-local + colors-console + dayjs ，内容难度不大，都是零散的东西拼凑在一起的，只希望对想学习的朋友有点帮助也是对自己项目经验的有效总结罢了。
话不多说咱就直接开始进入今天的正题咯。

一、 fs 是node 对于文件的处理模块

打包编译其实最重要的就是对文件的处理肯定是少不了的。
网上关于nodejs中对于fs的介绍很多很多了在此不做介绍感兴趣的朋友可以自己前往学习。
本次核心用到就是fs.exists 进行逻辑处理。

const fs = require("fs");fs.exists(urlH5,(res)=>{ console.log(colors('yellow', '确认h5包是否存在—--')) if(res){ console.log(colors(['greenBG','underline'], '存在h5资源包!')) reNameH5ToH5Zip(); }else{ console.log(colors("yellowBG",`完成构建时间:${dayjs().format('YYYY-MM-DD HH:mm:ss')}`)) console.log(colors('redBG', '请先用HBuilderX构建h5包,才可以压缩生产包!')) }})

二、 path 是node 对于文件路径的处理模块

本次方案的目的就是为了将最终的目标文件夹提取出来方便查看实现自定义位置打包，那么path就是做这部分工作的。
同理，path也是nodejs的知识点，在此更多的是教大家结合实战的思路不做深入介绍。
本次核心用到的就是path.join 进行逻辑处理。

const path = require('path')let urlH5 = path.join(__dirname, '/') + 'unpackage/dist/build/h5'let H5Zip = path.join(__dirname, '/') + 'h5.zip'

三、 zip-local 是 帮助处理文件压缩功能

zip-local这个三方插件是结合自身项目需要才选的，其实工作中没有固定的套路，核心是有效率地解决问题，所以引入合适的第三方依赖有时候是必要的。
如果你对zip-local感兴趣可以自己上网查询一下吧。
本次核心用到的就是path.join 进行逻辑处理。
zipper.sync.zip(urlH5).compress().save(H5Zip)。
简单讲就是压缩成品包并更名为指定文件名保存成.zip压缩包格式。

const zipper = require("zip-local");/ 打包 h5 转 zip包 /async function reNameH5ToH5Zip(){ try { await zipper.sync.zip(urlH5).compress().save(H5Zip) fs.exists(H5Zip,(res)=>{ if(res){ console.log(colors('greenBG', '构建成功h5.zip')) console.log(colors(["white","greenBG"],"压缩包构建结束,成功！
")) console.log(colors("yellowBG",`完成构建时间:${dayjs().format('YYYY-MM-DD HH:mm:ss')}`)) }else{ console.log(colors('red', '构建失败h5.zip')) console.log(colors(["black","redBG"],"压缩包构建结束,失败！
")) console.log(colors("yellowBG",`完成构建时间:${dayjs().format('YYYY-MM-DD HH:mm:ss')}`)) } }) } catch (error) { console.log(error) fs.exists(H5Zip,(res)=>{ if(res){ console.log(colors('greenBG', '构建成功h5.zip')) console.log(colors(["white","greenBG"],"压缩包构建结束,成功！
")) console.log(colors("yellowBG",`完成构建时间:${dayjs().format('YYYY-MM-DD HH:mm:ss')}`)) }else{ console.log(colors('red', '构建失败h5.zip')) console.log(colors(["black","redBG"],"压缩包构建结束,失败！
")) console.log(colors("yellowBG",`完成构建时间:${dayjs().format('YYYY-MM-DD HH:mm:ss')}`)) } }) } }小结

为了让分享更有实操性，我考虑将内容分为几篇文章进行编写，

第二部分先更新到这，如果你感兴趣不妨在下面留言互动。