Webpack 1.13.2 执行 shell 命令解决 打印时没有背景色和文字颜色的问题

这是因为 Webpack 1.13.2 不支持新的插件钩子 API。Webpack 1 的插件系统使用的是 plugin 方法,而不是 Webpack 4+ 中的 hooks

在 Webpack 1 中,你可以使用以下代码来确保 sed 命令在打包完成后执行:

const { exec } = require('child_process');module.exports = {// 你的其他 Webpack 配置plugins: [function() {this.plugin('compile', function() {// `grep -F '@media print{*,:after,:before{color:#000!important;text-shadow:none!important;background:0 0!important;-webkit-box-shadow:none!important;box-shadow:none!important}' node_modules/bootstrap/dist/css/bootstrap.min.css`// `sed -i 's|@media print{\\*,:after,:before{color:#000!important;text-shadow:none!important;background:0 0!important;-webkit-box-shadow:none!important;box-shadow:none!important}|@media print{|g' node_modules/bootstrap/dist/css/bootstrap.min.css`,exec(`grep -F '@media print{*,:after,:before{color:#000!important;text-shadow:none!important;background:0 0!important;-webkit-box-shadow:none!important;box-shadow:none!important}' node_modules/bootstrap/dist/css/bootstrap.min.css`,(error, stdout, stderr) => {if (error) {// 如果处理过的 (code: 1), 就不再继续执行, 也不用打印错误信息if (error.code !== 1) {console.error(`执行 grep 命令时出错: ${error.message}`);}return;}if (stderr) {console.error(`grep 命令输出错误: ${stderr}`);return;}console.log(`grep 命令执行完成`);exec(`sed -i 's|@media print{\\*,:after,:before{color:#000!important;text-shadow:none!important;background:0 0!important;-webkit-box-shadow:none!important;box-shadow:none!important}|@media print{|g' node_modules/bootstrap/dist/css/bootstrap.min.css`,(error, stdout, stderr) => {if (error) {console.error(`执行 sed 命令时出错: ${error.message}`);return;}if (stderr) {console.error(`sed 命令输出错误: ${stderr}`);return;}console.log(`sed 命令执行完成`);},);},);});},],
};

说明

  • 先通过 grep 所有是否需要修改, 如果不需要修改就不改了, 否则在 --watch 模式下会死循环的 build
  • this.plugin('compile', callback)compile 事件在 Webpack 编译开始之前触发,因此 sed 命令会在打包之前执行。
  • exec 命令直接在 compile 钩子中执行 sed,确保替换操作在打包完成后运行。

以上的 plugin 解决了引用 bootstrap 的 css 后, 打印时没有背景色和文字颜色的问题.

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

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

相关文章

【ASR技术】WhisperX安装使用

介绍 WhisperX 是一个开源的自动语音识别(ASR)项目,由 m-bain 开发。该项目基于 OpenAI 的 Whisper 模型,通过引入批量推理、强制音素对齐和语音活动检测等技术。提供快速自动语音识别(large-v2 为 70 倍实时&#xf…

android framework ams/wms常见系统日志(main\system\events\crash,protoLog使用)

重要性 wms和ams的一些系统原生日志能够帮助我们快速定位问题 日志分类 在日常framework工作中常见的日志类别如下: -b , --buffer Request alternate ring buffer, ‘main’, ‘system’, ‘radio’, ‘events’, ‘crash’, ‘default’ or ‘all’. Additiona…

2024年11月16日 星期六 重新整理Go技术

今日格言 坚持每天进步一点点~ 一个人也可以是一个团队~ 学习全栈开发, 做自己喜欢的产品~~ 简介 大家好, 我是张大鹏, 今天是2024年11月16日星期六, 很高兴在这里给大家分享技术. 今天又是休息的一天, 做了很多的思考, 整理了自己掌握的技术, 比如Java, Python, Golang,…

深度解读混合专家模型(MoE):算法、演变与原理

假设一个专家团队共同解决复杂问题。每位专家都拥有独特的技能,团队通过高效分配任务实现了前所未有的成功。这就是混合专家(Mixture-of-Experts,MoE)模型架构背后的基本思想,这种方法允许机器学习系统,特别…

Area-Composition模型部署指南

一、介绍 本模型可以通过输入不同的提示词,然后根据各部分提示词进行融合生成图片。如下图: 此图像包含 4 个不同的区域:夜晚、傍晚、白天、早晨 二、部署 环境要求: 最低显存:10G 1. 部署ComfyUI 本篇的模型部署…

HTML之列表学习记录

练习题&#xff1a; 图所示为一个问卷调查网页&#xff0c;请制作出来。要求&#xff1a;大标题用h1标签&#xff1b;小题目用h3标签&#xff1b;前两个问题使用有序列表&#xff1b;最后一个问题使用无序列表。 代码&#xff1a; <!DOCTYPE html> <html> <he…

Java基础-内部类与异常处理

(创作不易&#xff0c;感谢有你&#xff0c;你的支持&#xff0c;就是我前行的最大动力&#xff0c;如果看完对你有帮助&#xff0c;请留下您的足迹&#xff09; 目录 一、Java 内部类 什么是内部类&#xff1f; 使用内部类的优点 访问局部变量的限制 内部类和继承 内部…

C/C++中使用MYSQL

首先要保证下载好mysql的库和头文件&#xff0c;头文件在/usr/include/mysql/目录下&#xff0c;库在/usr/lib64/mysql/目录下&#xff1a; 一般情况下&#xff0c;在我们安装mysql的时候&#xff0c;这些都提前配置好了&#xff0c;如果没有就重装一下mysql。如果重装mysql还是…

华为ensp实验二--mux vlan的应用

一、实验内容 1.实验要求&#xff1a; 在交换机上创建三个vlan&#xff0c;vlan10、vlan20、vlan100&#xff0c;将vlan100设置为mux-vlan&#xff0c;将vlan10设置为group vlan&#xff0c;将vlan20设置为separate vlan&#xff1b;实现vlan10的设备在局域网内可以进行互通&…

Redis知识分享(三)

目录 前言 七、事务管理 7.1事务中的异常处理 八、订阅发布 8.1概述 ​8.2.Redis针对发布订阅相关指令 九、主从复制 9.1主从复制概述 9.2.主从复制的用处 9.3主从复制实现原理 ​9.3.1.psync指令 9.3.2.复制偏移量 9.3.3复制积压缓冲区&节点ID 前言 今天…

Java基础-组件及事件处理(中)

(创作不易&#xff0c;感谢有你&#xff0c;你的支持&#xff0c;就是我前行的最大动力&#xff0c;如果看完对你有帮助&#xff0c;请留下您的足迹&#xff09; 目录 BorderLayout布局管理器 说明&#xff1a; 示例&#xff1a; FlowLayout布局管理器 说明&#xff1a; …

【论文阅读】主动推理:作为感知行为的理论

文章目录 主动推理&#xff1a;作为感知行为的理论摘要1.引言2. 主动推理的概念和历史根源3. 主动推理的规范视角—以及它的发展历程 未完待续 主动推理&#xff1a;作为感知行为的理论 Active inference as a theory of sentient behavior 摘要 这篇文章综述了主动推理的历…

HuggingFace:基于YOLOv8的人脸检测模型

个人操作经验总结 1、YOLO的环境配置 github 不论base环境版本如何&#xff0c;建议在conda的虚拟环境中安装 1.1、创建虚拟环境 conda create -n yolov8-face python3.9conda create &#xff1a;创建conda虚拟环境&#xff0c; -n &#xff1a;给虚拟环境命名的…

React--》如何高效管理前端环境变量:开发与生产环境配置详解

在前端开发中&#xff0c;如何让项目在不同环境下表现得更为灵活与高效&#xff0c;是每个开发者必须面对的挑战&#xff0c;从开发阶段的调试到生产环境的优化&#xff0c;环境变量配置无疑是其中的关键。 env配置文件&#xff1a;通常用于管理项目的环境变量&#xff0c;环境…

SpringSecurity+jwt+captcha登录认证授权总结

SpringSecurityjwtcaptcha登录认证授权总结 版本信息&#xff1a; springboot 3.2.0、springSecurity 6.2.0、mybatis-plus 3.5.5 认证授权思路和流程&#xff1a; 未携带token&#xff0c;访问登录接口&#xff1a; 1、用户登录携带账号密码 2、请求到达自定义Filter&am…

计算机视觉和机器人技术中的下一个标记预测与视频扩散相结合

一种新方法可以训练神经网络对损坏的数据进行分类&#xff0c;同时预测下一步操作。 它可以为机器人制定灵活的计划&#xff0c;生成高质量的视频&#xff0c;并帮助人工智能代理导航数字环境。 Diffusion Forcing 方法可以对嘈杂的数据进行分类&#xff0c;并可靠地预测任务的…

2024-11-17 -MATLAB三维绘图简单实例

1. x -1:0.05:1; y x; [X, Y] meshgrid(x, y); f (X, Y) (sin(pi * X) .* sin(pi * Y)) .^ 2.*sin(2.*X2.*Y); mesh(X, Y, f(X, Y)); % 调用函数f并传递X和Y xlabel(X-axis); ylabel(Y-axis); zlabel(Z-axis); title(Surface Plot of (sin(pi * X) .* sin(pi * Y)) .^ 2.*…

WebAssembly在桌面级应用开发中的探索与实践

&#x1f493; 博客主页&#xff1a;瑕疵的CSDN主页 &#x1f4dd; Gitee主页&#xff1a;瑕疵的gitee主页 ⏩ 文章专栏&#xff1a;《热点资讯》 WebAssembly在桌面级应用开发中的探索与实践 WebAssembly在桌面级应用开发中的探索与实践 WebAssembly在桌面级应用开发中的探索…

第二十一周学习周报

目录 摘要Abstract1. LSTM原理2. LSTM反向传播的数学推导3. LSTM模型训练实战总结 摘要 本周的学习内容是对LSTM相关内容的复习&#xff0c;LSTM被设计用来解决标准RNN在处理长序列数据时遇到的梯度消失和梯度爆炸问题。LSTM通过引入门控机制来控制信息的流动&#xff0c;从而…

《Spring 基础之 IoC 与 DI 入门指南》

一、IoC 与 DI 概念引入 Spring 的 IoC&#xff08;控制反转&#xff09;和 DI&#xff08;依赖注入&#xff09;在 Java 开发中扮演着至关重要的角色&#xff0c;是提升代码质量和可维护性的关键技术。 &#xff08;一&#xff09;IoC 的含义及作用 IoC 全称为 Inversion of…