webpack插件给所有的:src文件目录增加前缀

1.webpack4的版本写法

class AddPrefixPlugin {apply(compiler) {compiler.hooks.compilation.tap('AddPrefixPlugin', (compilation) => {HtmlWebpackPlugin.getHooks(compilation).beforeEmit.tapAsync('AddPrefixPlugin',(data, cb) => {// 使用正则表达式替换所有包含 /static/file/ 的路径data.html = data.html.replace(/\/static\/file\//g, '/zhgdxmf/static/file/');cb(null, data);});});compiler.hooks.emit.tapAsync('AddPrefixPlugin', (compilation, callback) => {// 遍历所有输出的资源文件,替换其中的 /static/file/ 路径Object.keys(compilation.assets).forEach((assetName) => {if (assetName.endsWith('.js') || assetName.endsWith('.html')) {let content = compilation.assets[assetName].source();content = content.replace(/\/static\/file\//g, '/zhgdxmf/static/file/');compilation.assets[assetName] = {source: () => content,size: () => content.length};}});callback();});}
}module.exports = AddPrefixPlugin;

webpack 2 的版本

function AddPrefixPlugin(options) {this.options = options || {};
}AddPrefixPlugin.prototype.apply = function(compiler) {compiler.plugin('compilation', (compilation) => {compilation.plugin('html-webpack-plugin-before-html-processing', (htmlPluginData, callback) => {// 使用正则表达式替换所有包含 /static/file/ 的路径htmlPluginData.html = htmlPluginData.html.replace(/\/static\/file\//g, '/zhgdxmf/static/file/');callback(null, htmlPluginData);});compilation.plugin('optimize-assets', (assets, callback) => {// 遍历所有输出文件,替换其中的 /static/file/ 路径Object.keys(assets).forEach((assetName) => {if (assetName.endsWith('.js') || assetName.endsWith('.html')) {let content = assets[assetName].source();content = content.replace(/\/static\/file\//g, '/zhgdxmf/static/file/');assets[assetName] = {source: () => content,size: () => content.length};}});callback();});});
};module.exports = AddPrefixPlugin;

使用
在这里插入图片描述
在这里插入图片描述
在这里插入图片描述
全程借助chatgpt完成,感慨能力之强大啊

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处:http://www.mzph.cn/pingmian/50133.shtml

如若内容造成侵权/违法违规/事实不符,请联系多彩编程网进行投诉反馈email:809451989@qq.com,一经查实,立即删除!

相关文章

无人机之环保监控篇

随着科技的不断进步,无人机作为一种创新的技术手段,在环保监控领域发挥着越来越重要的作用。 一、覆盖范围广 无人机能够轻松覆盖广阔的地理区域,无论是偏远的山区、广袤的森林还是大型的工业园区。相比传统的地面检测方式,其不…

关于promise的一些例题(运行步骤详细说明)

关于promise的一些例题(详细说明) 基本例题 // 直接运行 输出 1 2 const promise new Promise((resolve, reject) > {console.log(1);resolve();console.log(2); });// then后面放入微队列 promise.then(() > {console.log(3); });// 输出4 之后没有代码了所以运行为队…

17 敏捷开发—Scrum(2)

从上一篇 「16 敏捷开发实践(1)」中了解了Scrum是一个用于开发和维护复杂产品的框架,是一个增量的、迭代的开发过程。一般由多个Sprint(迭代冲刺)组成,每个Sprint长度一般为2-4周。下面全面介绍Scrumde 角色…

PostgreSQL 数据库 安装

1、官网下载 起源与发展:PostgreSQL最初起源于加州大学伯克利分校的Postgres项目,该项目始于1986年,并一直演进到1994年。在1995年,Postgres项目增加了SQL翻译程序,并更名为Postgres95。随后,在1996年&…

Linux:core文件无法生成排查步骤

1、进程的RLIMIT_CORE或RLIMIT_SIZE被设置为0。使用getrlimit和ulimit检查修改。 使用ulimit -a 命令检查是否开启core文件生成限制 如果发现-c后面的结果是0,就临时添加环境变量ulimit -c unlimited,之后在启动程序观察是否有core生成,如果…

Linux网络:传输层协议TCP(一)

目录 一、TCP协议的定义 二、确认应答机制ACK 三、序号、确认序号 四、超时重传机制 一、TCP协议的定义 TCP 全称为 "传输控制协议(Transmission Control Protocol"). 人如其名, 要对数据的传 输进行一个详细的控制; TCP 协议段格式 • 源/目的端口号: 表示数据…

解决Windows 11更新错误0x800f081f的详细指南

在尝试更新Windows 11时,用户可能会遇到各种错误代码,其中之一是0x800f081f。这个错误通常与Windows更新组件或系统文件的损坏有关。本文将提供解决这一特定错误的详细步骤,并解释可能的原因。 错误代码0x800f081f概述 错误代码0x800f081f指…

pythonGame-实现简单的贪食蛇游戏

通过python简单复现贪食蛇游戏。 使用到的库函数: import pygame import time import random 游戏源码: import pygame import time import randompygame.init()white (255, 255, 255) yellow (255, 255, 102) black (0, 0, 0) red (213, 50, 80…

新版海螺影视主题模板M3.1全解密版本多功能苹果CMSv10后台自适应主题

苹果CMS2022新版海螺影视主题M3.1版本,这个主题我挺喜欢的,之前也有朋友给我提供过原版主题,一直想要破解但是后来找了几个SG11解密的大哥都表示解密需要大几百大洋,所以一直被搁置了。这个版本是完全解密的,无需SG11加…

学习日记:数据类型2

目录 1.转义字符 2.隐式类型转换 2.1 强制类型转换 2.2 不同类型间赋值 3.运算符 表达式 3.1 算术运算符 3.2 算术运算优先级 3.3 赋值运算 3.3.1 不同类型间混合赋值 3.4 逗号运算 4.生成随机数 5. 每日一练 1.转义字符 \n 表示换行 \t …

基于JSP、java、Tomcat三者的项目实战--校园交易网(1)-项目搭建(前期准备工作)

这是项目的初始页面 接下来我先写下我的初始项目搭建 技术支持:JAVA、JSP 服务器:TOMCAT 7.0.86 编程软件:IntelliJ IDEA 2021.1.3 x64 首先我们打开页面,准备搭建项目的初始准备 1.New Project 2.随后点击Next,勾…

Easy es问题总结

官网教程&#xff1a;https://www.easy-es.cn/pages/ac41f0/#settings 一 测试项目 1 pom <dependencies><!-- 排除springboot中内置的es依赖,以防和easy-es中的依赖冲突--><dependency><groupId>org.springframework.boot</groupId><artifa…

【Golang 面试基础题】每日 5 题(七)

✍个人博客&#xff1a;Pandaconda-CSDN博客 &#x1f4e3;专栏地址&#xff1a;http://t.csdnimg.cn/UWz06 &#x1f4da;专栏简介&#xff1a;在这个专栏中&#xff0c;我将会分享 Golang 面试中常见的面试题给大家~ ❤️如果有收获的话&#xff0c;欢迎点赞&#x1f44d;收藏…

脊髓小伙伴必看!超全维生素补给站,助力你的每一天活力满满✨

今天咱们来聊聊一个既严肃又暖心的话题——脊髓损伤后的维生素大补帖&#xff01;&#x1f31f; 记住&#xff0c;身体是革命的本钱&#xff0c;补充对的维生素&#xff0c;就是给自己的小宇宙加油哦&#xff01;&#x1f680; 首先&#xff0c;维生素D小太阳&#x1f31e;来啦…

Nestjs使用Redis的最佳实践

前几天在项目中有用到Redis JWT实现服务端对token的主动删除(退出登录功能)。故此介绍下如何在Nestjs中使用Redis&#xff0c;并做下总结。 知识准备 了解Redis - 网上很多简介。了解Nestjs如何使用jwt生成token - 可移步看下我之前的文章 效果展示 一、mac安装与使用 示…

php--序列化与反序列化

&#x1f3bc;个人主页&#xff1a;金灰 &#x1f60e;作者简介:一名简单的大一学生;易编橙终身成长社群的嘉宾.✨ 专注网络空间安全服务,期待与您的交流分享~ 感谢您的点赞、关注、评论、收藏、是对我最大的认可和支持&#xff01;❤️ &#x1f34a;易编橙终身成长社群&#…

机器学习 | 计算分类算法的ROC和AUC曲线以随机森林为例

受试者工作特征&#xff08;ROC&#xff09;曲线和曲线下面积&#xff08;AUC&#xff09;是常用的分类算法评价指标&#xff0c;本文将讨论如何计算随机森林分类器的ROC 和 AUC。 ROC 和 AUC是量化二分类区分阳性和阴性类别能力的度量。ROC曲线是针对不同分类阈值的真阳性率&…

LabVIEW座舱照明测控系统

用LabVIEW开发飞机座舱照明测控系统。系统通过集成可靠的硬件与软件技术&#xff0c;提高了测试的效率和自动化水平&#xff0c;确保了飞行安全性和舒适性。体现了系统的设计思路、主要组成部分、工作原理及实际应用效果。 项目背景 飞机座舱照明系统是航空电子系统中至关重要…

【Spring Boot教程:从入门到精通】掌握Spring Boot开发技巧与窍门(三)-配置git环境和项目创建

主要介绍了如何创建一个Springboot项目以及运行Springboot项目访问内部的html页面&#xff01;&#xff01;&#xff01; 文章目录 前言 配置git环境 创建项目 ​编辑 在SpringBoot中解决跨域问题 配置Vue 安装Nodejs 安装vue/cli 启动vue自带的图形化项目管理界面 总结 前言 …

谷粒商城实战笔记-63-商品服务-API-品牌管理-OSS获取服务端签名

文章目录 一&#xff0c;创建第三方服务模块thrid-party1&#xff0c;创建一个名为gulimall-third-party的模块2&#xff0c;nacos上创建third-party命名空间&#xff0c;用来管理这个服务的所有配置3&#xff0c;配置pom文件4&#xff0c;配置文件5&#xff0c;单元测试6&…