前言
刷题打卡任务结束了，大家在做任务的过程中应该也收获了很多，好多大佬13号一天肝了十篇二十篇是真的牛，在等待开奖之前不妨来参加一下任务二总结总结吧！
项目简介
Webpack上传腾讯云是我个人之前为了解决遇见的问题所写的一个NPM插件，主要就是在Webpack打包完成之后可以将项目包上传到指定的腾讯云对象存储，实现CDN加速功能，提升项目的打开和访问速度。
项目背景
Webpack上传腾讯云我在去年的时候发过一篇介绍的文章，我们公司是一个线上线下相结合的电商公司，有ToB、ToC等不同的平台，包含APP、H5、微信小程序、WEB等端。
因为我们的客户群体不仅在国内，海外也有一部分，所以用户的使用体验对于我们来说也是非常重要的一环，其中项目的打开速度是第一印象，所以我们的项目打包打包发布测试和正式环境都是放在CDN上的，之前我们都是放在某牛云上面，但是在去年八月份的时候突然出现了线上项目访问白屏、错误提示等比较严重的问题，当时我们平台正好也是在做活动，所以对于这个问题公司的领导都是非常重视，运营和客服也是一直在催问这个问题，我开始以为是打包过程中出错了，所以就重新打包发布，但是后来还是反馈同样的问题。
所以我当时又将项目的打包流程重新给过了一遍，用Debugger和console重新验证整个打包上传和发布功能，发现我们这边是没什么问题的，于是反馈给了当时在用的CDN平台，当时平台也是配合查找问题，但是也是没找到，我现在想起来也觉得是一个玄学问题。
时间不等人啊！当时也没有找到其他比较好的替代方案，所以我就自己写了一个插件用来将项目包上传到腾讯云上。
实践过程
我之前也没有写过Webpack插件，当时是边查阅资料和看别人写Webpack插件的相关文章，边学习边写demo来实现功能。
因为我一直用的是Vue，所以当时的demo和案例项目也都是用Vue来写的。
插件中用到了:
- fs;
- cos-nodejs-sdk-v5;
- path;
- ora;
- lodash.isregexp;
cos-nodejs-sdk-v5是腾讯云 COS Nodejs SDK。
ora主要用来实现node.js命令行环境的loading效果，和显示各种状态的图标等。
lodash.isregexp检查 value 是否是 RegExp 对象。
这个插件要实现支持:
- - secretId COS SecretId
- - secretKey COS SecretKey
- - bucket COS 存储对象名称，格式为对象名称加应用 ID，如：bucket-1250000000
- - region COS 存储地域，参见官方文档
- - path 存储路径， 默认为 [hash]，也可以指定 hash 长度，如: [hash:8]
- - exclude 可选，排除特定文件，正则表达式，如: /index.html$/
- - include 可选，指定要上传的文件，正则表达式，如: /app.js$/
- - batch 可选，批量上传文件并发数，默认 20
实现对路径的Hash替换。
配置传入信息收集。
定义任务数量的初始值。
使用filter来遍历做exclude和include处理。
然后得到需要处理的任务数理。
使用Promise来上传任务队列。
对于上传队列还要做响应的信息提示，错误收集等一些基本功能。
总结思考
当时写这个插件真的是时间要求的很紧，对于很多细节点处理的都非常的粗糙，也借鉴了别的开发者的一些关于上传过程中的理念。
写完之后我自己进行了一些本地的简单测试，然后就直接应用到了问题项目的测试环境，经过线上测试之后发布到正式环境。发布正式后就没有再出现之前所遇到的问题，后来我把前端的一些项目全都应用上了。
现在回过头来看发现这个插件还有很多的优化点和可以增加的功能，例如可以实现多平台支持、bug日志收集、上传流程简化等。
之前为什么没有做相关的优化和更新？
时间不允许啊，这两年因为疫情的原因，公司的业务也收到很大的波动，一直在尝试各种的突破渠道，对于我们技术来说就是一直在根据公司的需求进行开发，所以一直没有整片的时间回过头来看这个。
往期精彩文章
[LeetCode1550题存在连续三个奇数的数组] | 刷题打卡
[LeetCode0304题二维区域和检索 - 矩阵不可变] | 刷题打卡
本文正在参与「掘金 2021 春招闯关活动」, 点击查看活动详情
我是肥宅，希望你幸福❤️❤️❤️
