编写webpack插件自动上传sourceMap

ops/2024/9/24 0:52:19/

一个简化的Webpack插件示例,用于自动上传sourceMap文件到服务器
这个插件会在每次编译后寻找sourceMap文件,并将其上传到指定的服务器。这个例子假设服务器支持HTTPS,并且上传是通过POST请求实现的。根据实际情况,可能需要调整上传逻辑。

const fs = require('fs');
const path = require('path');
const https = require('https');class AutoUploadSourceMapPlugin {constructor(options) {this.options = options;}apply(compiler) {compiler.hooks.afterEmit.tapAsync('AutoUploadSourceMapPlugin', (compilation, callback) => {const assetNames = Object.keys(compilation.assets);const sourceMapAssetName = assetNames.find((name) => /\.map$/.test(name));if (!sourceMapAssetName) {callback();return;}const sourceMapPath = path.join(compilation.options.output.path, sourceMapAssetName);const sourceMapContent = fs.readFileSync(sourceMapPath, 'utf-8');const uploadOptions = {hostname: this.options.hostname,port: this.options.port,path: this.options.path,method: 'POST',headers: {'Content-Type': 'application/json','Content-Length': sourceMapContent.length}};const req = https.request(uploadOptions, (res) => {if (res.statusCode < 200 || res.statusCode >= 300) {console.error(`Upload failed with status code: ${res.statusCode}`);} else {console.log('SourceMap uploaded successfully');}callback();});req.on('error', (e) => {console.error(`Upload error: ${e.message}`);callback();});req.write(sourceMapContent);req.end();});}
}module.exports = AutoUploadSourceMapPlugin;

使用这个插件的方法是在webpack配置文件中如下配置:

const AutoUploadSourceMapPlugin = require('./AutoUploadSourceMapPlugin');module.exports = {// ... 其他webpack配置plugins: [new AutoUploadSourceMapPlugin({hostname: 'your-server.com',port: 443,path: '/path/to/upload/sourceMap'})]
};

http://www.ppmy.cn/ops/115036.html

相关文章

神奇的css动画:animation、transform、transition

前言 动画包括两个部分&#xff1a;描述动画的样式和用于指定动画开始、结束以及中间点样式的关键帧。 相比较于传统的脚本实现动画技术&#xff0c;使用css动画三个主要优点: 1.能够非常容易创建简单动画&#xff0c;甚至不需要了解JavaScript就能创建动画 2.动画运行效果…

FastAPI挂载静态资源

FastAPI挂载静态资源 使用场景&#xff1a;前后端不分离&#xff0c;后端挂载图片&#xff0c;css,js等静态资源&#xff0c;给客户端响应html页面 首先假设项目根目录为app&#xff0c;app目录下的static为存放静态资源的目录 #app/main.py from fastapi import FastAPIapp…

Java集合(Map篇)

一.Map a.使用Map i.键值&#xff08;key-value&#xff09;映射表的数据结构&#xff0c;能高效通过key快速查找value&#xff08;元素&#xff09;。 ii.Map是一个接口&#xff0c;最常用的实现类是HashMap。 iii.重复放入k-v不会有问题&#xff0c;但是一个…

Go语言的io输入输出流

Go语言的输入输出流不如其他语言那么直观&#xff0c;由于是通过实现接口方法的隐式继承所以比较抽象&#xff0c;今天具体介绍一下go语言的输入输出流。 go语言输入输出在io库中&#xff0c;使用Reader接口&#xff0c;如下&#xff1a; type Reader interface {Read(p []by…

计算机前沿技术-人工智能算法-大语言模型-最新论文阅读-2024-09-17

计算机前沿技术-人工智能算法-大语言模型-最新论文阅读-2024-09-17 1. Large Language Models in Biomedical and Health Informatics: A Review with Bibliometric Analysis H Yu, L Fan, L Li, J Zhou, Z Ma, L Xian, W Hua, S He… - Journal of Healthcare …, 2024 生物…

第四届计算机、信息工程与电子材料国际学术会议 (CTIEEM 2024)

目录 重要信息 大会简介 出版信息 大会组委 会议征稿主题 会议议程 参会须知 重要信息 大会时间&#xff1a;2024年11月15-17日 大会地点&#xff1a;中国-郑州 大会官网&#xff1a;www.ctieem.org 收录检索&#xff1a;EI Compendex&#xff0c;Scopus 大会简介 随着信…

Web端云剪辑解决方案,BS架构私有化部署,安全可控

传统视频制作流程繁琐、耗时&#xff0c;且对专业设备和软件的高度依赖&#xff0c;常常让企业望而却步&#xff0c;美摄科技凭借其强大的技术实力和创新能力&#xff0c;推出了面向企业用户的Web端云剪辑解决方案&#xff0c;为企业提供一站式、高效、便捷的视频生产平台。 B…

电影评论|基于springBoot的电影评论网站设计与实现(附项目源码+论文+数据库)

私信或留言即免费送开题报告和任务书&#xff08;可指定任意题目&#xff09; 目录 一、摘要 二、相关技术 三、系统设计 四、数据库设计 五、核心代码 六、论文参考 七、源码获取&#xff1a; 一、摘要 随着信息技术在管理上越来越深入而广泛的应用&#xff0c…