当前位置：首页 > news >正文

webpack5基础（上篇）

news 来源：原创 2025/5/16 0:28:02

一、基本配置

在开始使用 webpack 之前，我们需要对 webpack 的配置有一定的认识

1、5大核心概念

1）entry （入口）

指示 webpack 从哪个文件开始打包

2）output（输出）

制视 webpack 打包完的文件输出到那里去，如何命名等

3）loader（加载器）

webpack 本身只能处理 js、json 等资源，其他资源需要借助 loader webpack 才能解析

4）plugins（插件）

扩展 webpack 的功能

5）mode（模式）

主要有两种模式：
开发模式：development
生产环境：production

2、配置文件

项目中添加文件，命名为 webpack.config.js

const path = require("path")module.exports = {// 入口entry: "./main.js",// 相对路径// 输出output: {// __dirname 是 nodejs 的遍历，代表当前文件的文件夹目录path: path.resolve(__dirname, "dist"),// 绝对路径filename: "main.js"},// 加载器module: {rules: [// loader 的配置]},// 插件plugins: [],// 模式mode: "development", // 开发模式
}

二、开发模式介绍

开发模式顾名思义就是我们开发代码时使用的模式。
这个模式下我们主要做两件事情：

1、编译代码，使浏览器能够识别运行

开发时我们有样式资源、字体图标、图片压缩、html资源等，webpack 默认都不能处理这些资源，所以我们要加载配置来编译这些资源

2、代码质量检查，树立代码规范

提前检查代码的一些隐患，让代码运行时能更加健壮
提前检查代码规范和格式，统一团队编码风格，让代码更优雅美观

三、处理样式资源

css，less，sass，scss styl 等样式资源

SCSS/SASS 相对于 CSS 的优势：

变量支持

// 定义变量
$primary-color: #3498db;
$font-size: 16px;// 使用变量
body {font-size: $font-size;color: $primary-color;
}

更好的样式嵌套

.nav {ul {list-style: none;}li {display: inline-block;a {color: $primary-color;}}
}

可复用的混合宏（Mixins）

@mixin border-radius($radius) {-webkit-border-radius: $radius;-moz-border-radius: $radius;border-radius: $radius;
}.box { @include border-radius(10px); 
}

样式继承

.btn {padding: 10px;background-color: $primary-color;
}
.btn-primary {@extend .btn;
}

条件语句和循环

$theme: light;
body {@if $theme == light {background-color: white;} @else {background-color: black;}
}
// 循环生成多个类
@for $i from 1 to 5 {.item-#{$i} {width: 100px * $i;}
}

样式模块化（Partials）

// _variables.scss
$primary-color: #3498db;//index.scss
@import 'variables';

数学运算

.container {width: 100% - 20px;margin: 10px * 2;
}

更强的性能优化能力：
SCSS/SASS 在编译时会压缩和优化代码，移除多余的空格、注释等，从而减少最终生成的 CSS 文件的大小，提高页面加载性能。

CSS 需要手动进行优化，或者依赖外部工具进行压缩。

支持模块系统（@use 和 @forward）

// _colors.scss
$primary-color: #3498db;
// main.scss
@use 'colors';
body {color: colors.$primary-color;
}

1、介绍

webpack 本身是不能识别样式资源的，所以我们需要借助 Loader 来帮助 webpack 解析样式资源
我们找 Loader 都应该去官方文档中查找使用
官方文档：https://webpack.docschina.org/concepts/#loaders

2、处理 css 资源

1）下载包

npm i css-loader style-loader -D
注意：需要下载两个 loader

2）功能介绍

css-loader：负责将 css 文件编译成 webpack 能识别的模块

style-loader：会动态创建一个 style 标签，里面放置webpack 中 css 模块内容

此时样式就会以 style 标签的形式在页面上生效

3）配置

module.exports = {module: {rules: [{test: /\.css$/i,use: ['style-loader', 'css-loader'],},],},
};

const path = require("path")module.exports = {// 入口entry: "./main.js",// 相对路径// 输出output: {// __dirname 是 nodejs 的遍历，代表当前文件的文件夹目录path: path.resolve(__dirname, "dist"),// 绝对路径filename: "main.js"},// 加载器module: {rules: [// loader 的配置{test: /\.css$/i,// 正则检测哪些文件// use 的执行顺序 从右往左（从下到上）， use: ['style-loader', // 通过创建style 标签添加到html 文件中生效'css-loader' // 将css 资源编译成 commonjs的模块到 js 中],},]},// 插件plugins: [],// 模式mode: "development", // 开发模式
}

3、处理 less 资源

1）安装

npm install less less-loader --save-dev
将 less 文件编译成 css 文件

2）配置(webpack.config.js)：

module.exports = {module: {rules: [{test: /\.less$/i,use: [// compiles Less to CSS'style-loader','css-loader','less-loader',],},],},
};

4、处理 scss/sass 资源

1）安装

npm install sass-loader sass webpack --save-dev

2）配置

module.exports = {module: {rules: [{test: /\.s[ac]ss$/i,//匹配 sass/scss 两种文件use: [// 将 JS 字符串生成为 style 节点'style-loader',// 将 CSS 转化成 CommonJS 模块'css-loader',// 将 Sass 编译成 CSS'sass-loader',],},],},
};

5、处理 Styl 资源

1）安装

npm i stylus-loader -D

2）配置

module.exports = {module: {rules: [{test: /\.styl$/i,//匹配 sass/scss 两种文件use: [// 将 JS 字符串生成为 style 节点'style-loader',// 将 CSS 转化成 CommonJS 模块'css-loader',// 将 Sass 编译成 CSS'stylus-loader',],},],},
};

四、处理图片资源

过去在 webpack4 时，我们处理图片资源通过 file-loader 和 url-loader 进行处理

现在 webpack5 已经将两个 Loader 功能内置到 webpack 里了，我们只需要简单配置即可处理图片资源

1、配置

const path = require("path")
module.exports = {entry: './main.js',output: {path: path.resolve(__dirname, "dist"),filename: 'main.js'},module: {rules: [{test: /\.(png|jpg|webp|svg|jpeg|gif)/,type: 'asset',parser: {dataUrlCondition: {// 小于 10kb 的图片转换成 base64.maxSize: 10 * 1024 }}}]}
}

图片转成 base64 的优势是减少请求数量，缺点是体积会变大。
一般小图片会考虑转成 base64，大图还是请求（如果也转换 base64 的话就导致页面加载缓慢）

有转换的时候，图片在打包后的文件夹里会少一些

2、修改不同资源的输出目录，比如图片到 image， css 到 css 文件夹

const path = require("path")
module.exports = {entry: './main.js',output: {path: path.resolve(__dirname, "dist"),filename: 'static/js/main.js'// 入口的文件打包以后输出到 js 中},module: {rules: [{test: /\.(png|jpg|webp|svg|jpeg|gif)/,type: 'asset',parser: {dataUrlCondition: {// 小于 10kb 的图片转换成 base64.maxSize: 10 * 1024 }},generator: {//hash 值， ext 扩展名 query 一些其他的参数 ； hash:10表示hash值取前10位，不写就是全部filename: 'static/image/[hash:10][ext][query]'}}]}
}

3、自动清空上次打包的内容

webpack4 需要 clearwebpackplugin 的插件来处理，webpack5 加一个 clean 参数即可

const path = require("path")
module.exports = {entry: './main.js',output: {path: path.resolve(__dirname, "dist"),filename: 'static/js/main.js',// 入口的文件打包以后输出到 js 中clean: true // 原理：到抱歉将path 整个目录内容清空},module: {rules: [{test: /\.(png|jpg|webp|svg|jpeg|gif)/,type: 'asset',parser: {dataUrlCondition: {// 小于 10kb 的图片转换成 base64.maxSize: 10 * 1024 }},generator: {//hash 值， ext 扩展名 query 一些其他的参数 ； hash:10表示hash值取前10位，不写就是全部filename: 'static/image/[hash:10][ext][query]'}}]}
}

五、处理字体图标资源

1、下载字体图标并引入到 main.js 中

iconfont，可以在阿里巴巴的矢量图中下载。

const path = require("path");
module.exports = {entry: './main.js',output: {path: path.resolve(__dirname, "dist"),filename: 'static/js/main.js',// 入口的文件打包以后输出到 js 中clean: true // 原理：到抱歉将path 整个目录内容清空},module: {rules: [{test: /\.(png|jpg|webp|svg|jpeg|gif)/,type: 'asset', // 会转成base64parser: {dataUrlCondition: {// 小于 10kb 的图片转换成 base64.maxSize: 10 * 1024 }},generator: {//hash 值， ext 扩展名 query 一些其他的参数 ； hash:10表示hash值取前10位，不写就是全部filename: 'static/image/[hash:10][ext][query]'}},{test: /\.(ttf|woff2?)/,type: 'asset/resource', // 原样输出，不再转换parser: {dataUrlCondition: {// 小于 10kb 的图片转换成 base64.maxSize: 10 * 1024 }},generator: {//hash 值， ext 扩展名 query 一些其他的参数 ； hash:10表示hash值取前10位，不写就是全部filename: 'static/fonts/[hash:10][ext][query]'}}]}
}

六、处理 js 资源

为什么还需要处理 js资源？
原因是 webpack 对 js 处理是有限的，只能编译 js 中 ES 模块化语法，不能编译其他语法，导致 js 不能在 IE 等浏览器运行，所以还需要做一些兼容性处理

1、Eslint

可组装的 JavaScript 和 JSX 检查工具。

这句话意思就是：它用来检测 js 和 jsx 的工具，可以配置各项功能

1.1 配置文件

配置文件有很多写法

eslintrc.* 新建文件，位于项目根目录
.eslintrc
.eslintrc.js
.eslintrc.json
区别在于配置格式不一样

ESlint会查找和自动读取他们，所以以上配置文件只需要存在一个即可

1.2 具体配置

以 .eslintrc.js 配置文件为例

module.exports = {// 解析选项parserOptions: {ecamVersion: 6,// ES 语法版本sourceType: 'module',// ES 模块化ecmaFeatures: {// ES 其他特性jsx: true, // 如果是 React 项目，就需要开启 jsx 语法}},// 具体检查规则rules: {//  "off" 或 0：关闭规则// "warn" 或 1：开启规则，使用警告级别的错误，warn 不会导致程序退出// “error”或2：开启规则，使用错误级别的错误：error 当被触发的时候，程序会退出semi: "error", // 禁止使用分号'array-callback-return': 'warn',// 强制数组方法的回调函数中有 return 语句，否则警告'default-case': ['warn',{commonentPattern: '^no default$'} // 允许在最后注释 no default ，就不会有警告了],eqeqeq: ['warn', // 强制使用 === 和 !== ，否则警告'smart']},// 继承其他规则，直接使用 网站上别人写好的规则或者是官方写好的规则extends: []
}

webpack5基础（上篇）

一、基本配置在开始使用 webpack 之前，我们需要对 webpack 的配置有一定的认识 1、5大核心概念 1）entry （入口） 指示 webpack 从哪个文件开始打包 2）output（输出） 制视 webpack 打包完的…...

编程日记 2025/5/16 0:28:02

C#设计模式（行为型模式）：观察者模式

C#设计模式：观察者模式，让对象间通信更优雅在软件开发中，我们经常会遇到一个对象的状态发生改变，其他对象需要自动更新或做出相应反应的场景。例如： GUI事件处理： 当用户点击按钮时，按钮需要…...

编程日记 2025/5/13 17:46:25

pg_wal 目录下 wal 日志文件异常累积过大

文章目录背景当前配置分析解决过程1. 活动事务未完成2. 备份滞后或归档未完成3. 保留了过多的 WAL 文件4. 逻辑复制槽未释放5. 文件系统问题6. 强制触发 WAL 清理结果lsof D 是啥意思检查进程从名字来看, 该 wal 文件是最小的文件(一般也是最老的 wal 文件)pg_archivecleanup …...

编程日记 2025/5/13 12:11:00

【人工智能】用Python实现深度卷积生成对抗网络（DCGAN）：原理、实现与优化

《Python OpenCV从菜鸟到高手》带你进入图像处理与计算机视觉的大门！解锁Python编程的无限可能：《奇妙的Python》带你漫游代码世界深度卷积生成对抗网络（DCGAN）是一种结合了卷积神经网络（CNN）和生成对抗网络（GAN）的深度学习模型，广泛应用于图像生成、图像增强、以…...

编程日记 2025/5/15 13:54:11

领域驱动设计（4）—绑定模型与实现

（4）—绑定模型与实现模式：MODEL-DRIVEN DESIGN为什么模型对用户至关重要?模式：HANDS-ON MODELER 很多项目设计之初只考虑到模型如何设计，没有将模型如何实现、数据关系如何存储这些实现考虑在内，往往设计…...

编程日记 2025/5/7 21:12:42

logback日志框架源码分析

目录（一）入口：slf4j选择日志框架（二）日志框架初始化（1）logback的3种配置方式 a、BasicConfigurator默认配置 b、SPI方式配置的Configurator实现类 c、通过配置文件初始化（2）xml配置文件初始化（三）Logger的创建（四）打印日志本文源码基于：logback版…...

编程日记 2025/5/8 17:24:55

Airflow：HttpSensor实现API驱动数据流程

数据管道工作流通常依赖于api来访问、获取和处理来自外部系统的数据。为了处理这些场景，Apache Airflow提供了HttpSensor，这是一个内置的Sensor，用于监视HTTP请求的状态，并在满足指定条件时触发后续任务。在这篇博文中&#xff0c…...

编程日记 2025/5/5 0:23:46

在Mac电脑上搭建Gradle

1. 检查是否已安装Homebrew 打开终端，输入以下命令检查Homebrew是否已安装： brew -v如果显示版本号，则表示已安装。如果未安装，请运行以下命令安装Homebrew： /bin/bash -c "$(curl -fsSL https://raw.githubus…...

编程日记 2025/5/10 14:16:56

登录的几种方式

使用Session完成登录 1. 手机号发送验证码逻辑步骤： 校验手机号格式是否正确。生成验证码（例如使用Hutool工具类）。将手机号和验证码存入Session。返回验证码发送成功的响应。 2. 用户登录逻辑逻辑步骤： 从Session中获取存…...

编程日记 2025/5/15 11:00:08

Python学习（5）：数据结构

1 列表 1.1 列表方法列表数据类型支持很多方法，列表对象的所有方法所示如下： list.append(x)：在列表末尾添加一项。类似于 a[len(a):] [x]。list.extend(iterable)：通过添加来自 iterable 的所有项来扩展列表。类似于 a[len…...

编程日记 2025/5/14 21:41:03

第五届电网系统与绿色能源国际学术会议（PGSGE 2025）

2025年第五届电网系统与绿色能源国际学术会议(PGSGE 2025) 定于2025年01月10-12日在吉隆坡召开。第五届电网系统与绿色能源国际学术会议（PGSGE 2025） 基本信息会议官网：www.pgsge.org【点击投稿/了解会议详情】会议时间：202…...

编程日记 2025/5/10 20:45:22

【顶刊TPAMI 2025】多头编码（MHE）之极限分类 Part 1：背景动机

目录 1 简单概括2 几个重要发现3 主要贡献4 背景知识5 方法简介论文：Multi-Head Encoding for Extreme Label Classification 作者：Daojun Liang, Haixia Zhang, Dongfeng Yuan and Minggao Zhang 单位：山东大学代码：https://gi…...

编程日记 2025/5/16 7:25:56

ruckus R510升级到Unleashe后不能访问

ruckus R510 是IPQ4019，升级到Unleashe，它弹窗提示但是这个IP没办法用，访问不了AP。必应了一下，官方提示用advance ip scanner扫描。扫描持续好久，发现IP竟然是从主路由获得。 9090的端口不用填，甚至不…...

编程日记 2025/5/12 13:55:31

初学stm32 --- FSMC驱动LCD屏

目录 FSMC简介 FSMC框图介绍 FSMC通信引脚介绍 FSMC_NWE 的作用 FSMC_NWE 的时序关系 FSMC_NOE 的含义 FSMC_NOE 的典型用途 FSMC_NOE 的时序关系使用FSMC驱动LCD FSMC时序介绍时序特性中的 OE ILI9341重点时序： FSMC地址映射 HADDR与FSMC_A关系 LCD的…...

编程日记 2025/5/13 9:18:46

【2025最新计算机毕业设计】基于Spring Boot+Vue影院购票系统（高质量源码，提供文档，免费部署到本地）

作者简介：✌CSDN新星计划导师、Java领域优质创作者、掘金/华为云/阿里云/InfoQ等平台优质作者、专注于Java技术领域和学生毕业项目实战,高校老师/讲师/同行前辈交流。✌ 主要内容：🌟Java项目、Python项目、前端项目、PHP、ASP.NET、人工智能…...

编程日记 2025/5/15 14:53:10

Java 内存溢出（OOM）问题的排查与解决

在 Java 开发中，内存溢出（OutOfMemoryError，简称 OOM）是一个常见且棘手的问题。相比于数组越界、空指针等业务异常，OOM 问题通常更难定位和解决。本文将通过一次线上内存溢出问题的排查过程，分享从问题表现…...

编程日记 2025/5/15 11:59:32

Android14 CTS-R6和GTS-12-R2不能同时测试的解决方法

背景 Android14 CTS r6和GTS 12-r1之后，tf-console默认会带起OLC Server，看起来olc server可能是想适配ATS(android-test-station)，一种网页版可视化、可配置的跑XTS的方式。这种网页版ATS对测试人员是比较友好的，网页上简单配置下…...

编程日记 2025/5/16 6:32:20

周末总结(2024/01/04)

工作人际关系核心实践： 要学会随时回应别人的善意，执行时间控制在5分钟以内坚持每天早会打招呼遇到接不住的话题时拉低自己，抬高别人(无阴阳气息) 朋友圈点赞控制在5min以内，职场社交不要放在5min以外职场的人际关系在面对利…...

编程日记 2025/5/16 6:44:56

《Rust权威指南》学习笔记（二）

枚举enum 1.枚举的定义和使用如下图所示： 定义时还可以给枚举的成员指定数据类型，例如：enum IpAddr{V4(u8, u8, u8, u8),V6(String),}。枚举的变体都位于标识符的命名空间下，使用::进行分隔。 2.一个特殊的枚举Option&#xff0…...

编程日记 2025/5/15 3:25:11

Docker 远程访问完整配置教程以及核心参数理解

Docker 远程访问完整配置教程以下是配置 Docker 支持远程访问的完整教程，包括参数说明、配置修改、云服务器安全组设置、主机防火墙配置，以及验证远程访问的详细步骤。 1. 理解 -H fd:// 参数的作用（理解了以后容易理解后面的操作&#xff…...

编程日记 2025/5/16 6:13:56

在ros2 jazzy和gazebo harmonic下的建图导航（cartographer和navigation）实现（基本）

我的github分支！！！ 你可以在这里找到相对应的源码。 DWDROME的MOGI分支来源于！！ MOGI-ROS/Week-3-4-Gazebo-basics 学习分支整理日志分支概述这是一个用于个人学习的新分支，目的是扩展基本模型并添加…...

编程日记 2025/5/15 13:23:03

常见的显示器分辨率及其对应的像素数量

显示器的像素数量通常由其分辨率决定，分辨率表示为水平像素数乘以垂直像素数。 720P（1280720）： 像素数量：约92.16万特点：这是高清标准的一个分辨率，通常用于手机、平板电脑或小型显示器。900P&…...

编程日记 2025/5/11 23:05:57

浅谈分布式共识算法

分布式共识算法基础概念1、容错2、共识3、拜占庭将军问题4、多数派5、共识算法分类6、ACID&BASE&CAP Paxos1、相关概念2、三种角色3、运行阶段4、Multi Paxos5、总结6、演化 ZAB1、相关概念2、三种角色3、成员状态4、运行阶段5、ZooKeeper流程6、总结 Raft1、相关概念…...

编程日记 2025/5/16 6:07:17

[Linux]redis5.0.x升级至7.x完整操作流程

1. 从官网下载最新版redis： 官网地址：https://redis.io/download 注：下载需要的登录，如果选择使用github账号登录，那么需要提前在github账号中取消勾选“Keep my email addresses private”（隐藏我的邮箱…...

编程日记 2025/5/14 11:32:46

Vue项目中生成node_modules文件夹的两种常用方法及npm优势

在Vue项目中生成node_modules文件夹的过程非常简单，主要步骤如下： 1、使用 npm 安装依赖包； 2、使用 yarn 安装依赖包。其中，推荐使用npm安装依赖包，原因如下：兼容性更广：npm是Node.js的默认包管理工具，具有更高的兼容性。社区支持：npm拥有更大的用户基础和社区支持，…...

编程日记 2025/5/16 6:16:23

（四）基于STM32通过Event Recoder实现时间测量功能

目录 1. 了解Event Recorder 2. 硬件和软件准备硬件需求软件需求 3. 配置STM32工程使用STM32CubeMX初始化项目配置Event Recorder 4. 实现时间记录功能初始化Event Recorder 时间间隔计算配置Debug选项测量结果查看 5总结在嵌入式系统开发中，精…...

编程日记 2025/5/15 22:06:42

【Linux】定时运行shell脚本

1、at命令 at命令允许指定Linux系统何时运行脚本，它会将作业提交到队列中，指定shell在什么时候运行该作业。 at 的守护进程 atd 在后台运行，在作业队列中检查待运行的作业。 at 守护进程会检查系统的一个特殊目录（一般位于/var/…...

编程日记 2025/5/16 7:08:04

ARM 汇编基础总结

GNU 汇编语法编写汇编的过程中，其指令、寄存器名等可以全部使用大写，也可以全部使用小写，但是不能大小写混用。 1. 汇编语句的格式 label: instruction comment label即标号，表示地址位置，有些指令前面可能会有标…...

编程日记 2025/5/11 23:22:19

L27.【LeetCode笔记】2 的幂(五种解法)

目录 1.题目 2.自解方法1:调用log函数代码提交结果方法2:循环提交结果 3.优解方法3:位运算n & (n-1) 0 代码提交结果方法4:位运算lowbit 代码提交结果 4.投机取巧的方法代码提交结果 1.题目 https://leetcode.cn/problems/power-of-two/?env…...

编程日记 2025/5/14 15:38:22

【MyBatis-Plus】让 MyBatis 更简单高效

如果你曾经使用过 MyBatis，你一定知道它的强大和灵活。然而，随着项目规模的增长，手写 SQL 成为了一件既繁琐又容易出错的事。这时，MyBatis-Plus（简称 MP）应运而生，它为 MyBatis 增强了许多功能&…...

编程日记 2025/5/16 7:03:33

如何使用OpenCV进行抓图-多线程

前言需求： 1、如何使用OpenCV捕抓Windows电脑上USB摄像头的流、 2、采用多线程 3、获知当前摄像头的帧率。这个需求，之前就有做了，但是由于出现了一个问题，人家摄像头的帧率目前都可以达到60帧/s 了，而我的程序…...

编程日记 2025/5/12 11:10:46

解决安装pynini和WeTextProcessing报错问题

点击这里，访问博客 0. 背景最近在给别人有偿部署ASR-LLM-TTS项目时遇到安装pynini和WeTextProcessing依赖报错的问题，报错信息如下： IC:\Program Files (x86)\Windows Kits\10\include\10.0.22621.0\ucrt" "-IC:\Program Files…...

编程日记 2025/5/16 7:04:40

数据中台与数据治理服务方案[50页PPT]

本文概述了数据中台与数据治理服务方案的核心要点。数据中台作为政务服务数据化的核心，通过整合各部门业务系统数据，进行建模与加工，以新数据驱动政府管理效率提升与政务服务能力增强。数据治理则聚焦于解决整体架构问题，确保数据…...

编程日记 2025/5/12 15:12:12

springCloud 脚手架项目功能模块：Java分布式锁

文章目录引言分布式锁产生的原因：集群常用的分布式锁分布式锁的三种实现方式I ZooKeeper 简介zookeeper本质上是一个分布式的小文件存储系zookeeper特性：全局数据一致性II 基于ZooKeeper 实现一个排他锁创建锁获取锁释放锁Apache ZooKeeper客户端III 分布式锁方案非公平锁方…...

编程日记 2025/5/14 23:44:25

一文讲清楚HTTP常见的请求头和应用

文章目录一文讲清楚HTTP常见的请求头和应用1. 啥是个HTTP请求头2. 常见的请求头，作用和示例3.协商缓存4.会话状态一文讲清楚HTTP常见的请求头和应用 1. 啥是个HTTP请求头一句话，说白了就是限定HTTP传输的一些规则参数，比如Accept&#xf…...

编程日记 2025/5/16 7:00:12

ImportError: /lib/x86_64-linux-gnu/libc.so.6: version `GLIBC_2.32‘ not found

这个问题之前遇到过，没有记录，导致今天又花了2小时原因是没有GLIBC——2.32 使用以下命令查一下有哪些版本： strings /lib/x86_64-linux-gnu/libm.so.6 | grep GLIBC_ 我已经安装好了，所有有2.32版本原因是当前的ubuntu版本…...

编程日记 2025/5/16 6:49:46

一、对照版本版本对照pytorch/vision: Datasets, Transforms and Models specific to Computer Vision 二、下载对应版本的torchvision 下载连接1download.pytorch.org/whl/torch_stable.html 下载连接2download.pytorch.org/whl/cu110/torch_stable.html 笔者认为1会比2更…...

编程日记 2025/5/13 13:40:12

UE4_用户控件_3_用户控件输入数据的方法

祝愿大美兰陵越来越好！ 一、效果展示： 二、先制作一个角色 1、新建个父类为pawn的蓝图类。更名为BP_Image_Character。 2、这个角色只是用于观察场景，并与场景中的物体相碰撞用的，所以不需要骨骼网格体， 3、但是我们…...

编程日记 2025/5/13 15:38:49

以往博客的复习补充——part1

之前没更新是因为期末考试要复习，没空写博客。1月3号才考完，现在有空，打算从头看一遍，既是复习以前知识点，又是对原来的博客进行补充。刚好寒假，有大把时间。一，希尔排序（Shell So…...

编程日记 2025/5/14 7:43:32

数据挖掘——决策树分类

数据挖掘——决策树分类决策树分类Hunt算法信息增益增益比率基尼指数连续数据总结决策树分类树状结构，可以很好的对数据进行分类； 决策树的根节点到叶节点的每一条路径构建一条规则；具有互斥且完备的特点，即每一个样本均被且…...

编程日记 2025/5/11 12:20:49

Kafka 快速实战及基本原理详解解析-01

一、Kafka 介绍 1. MQ 的作用消息队列（Message Queue，简称 MQ）是一种用于跨进程通信的技术，核心功能是通过异步消息的方式实现系统之间的解耦。它在现代分布式系统中有着广泛的应用，主要作用体现在以下三个方面&…...

编程日记 2025/5/12 5:22:19

大模型在自动驾驶领域的应用和存在的问题

大模型在自动驾驶领域的应用与挑战大模型（如 GPT-4、BERT等）已经在多个领域取得了突破，自动驾驶是其中一个受益颇多的行业。随着人工智能和深度学习的快速发展，自动驾驶技术正在向更加智能化、自动化和安全的方向发展。大模型在…...

编程日记 2025/5/10 22:36:21

【0x0014】HCI_Read_Local_Name命令详解

目录一、命令概述二、命令格式三、返回事件及参数说明 3.1. HCI_Command_Complete 事件 3.2. Status 3.3. Local_Name 四、命令执行流程 4.1. 命令发送 4.2. 控制器接收并处理命令 4.3. 控制器返回结果 4.4. 主机接收并解析事件包 4.5. 示例代码五、应用场景 …...

编程日记 2025/5/10 8:01:03

理解Java领域中的 DTO、PO 和 VO

在 Java 开发中，DTO（Data Transfer Object）、PO（Persistent Object）和 VO（Value Object）是在不同层面用于数据处理和传递的概念，它们各自有着独特的作用： 一、DTO&#…...

编程日记 2025/5/14 17:27:06

成都和力九垠科技有限公司九垠赢系统Common存在任意文件上传漏洞

免责声明: 本文旨在提供有关特定漏洞的深入信息，帮助用户充分了解潜在的安全风险。发布此信息的目的在于提升网络安全意识和推动技术进步，未经授权访问系统、网络或应用程序，可能会导致法律责任或严重后果。因此，作者不对读者基于本文内容所采取的任何行为承担责任。读者在…...

编程日记 2025/5/13 9:31:26

框架模块说明 #09 日志模块_01

背景日志模块是系统的重要组成部分，主要负责记录系统运行状态和定位错误问题的功能。通常，日志分为系统日志、操作日志和安全日志三类。虽然分布式数据平台是当前微服务架构中的重要部分，但本文的重点并不在此，而是聚焦于自定义…...

编程日记 2025/5/12 17:22:11

Unity热更文件比较工具类

打包出来的热更文件，如果每次都要全部上传到CDN文件服务器，不进耗费时间长，还浪费流量。所以让AI写了个简单的文件比较工具类，然后修改了一下可用。记录一下。路径可自行更改。校验算法这里使用的是MD5，如果使用SH…...

编程日记 2025/5/9 22:30:38

Python性能分析深度解析：从`cProfile`到`line_profiler`的优化之路

《Python OpenCV从菜鸟到高手》带你进入图像处理与计算机视觉的大门！解锁Python编程的无限可能：《奇妙的Python》带你漫游代码世界在软件开发过程中，性能优化是提升应用质量和用户体验的关键环节。Python作为广泛应用的高级编程语言，其性能分析工具为开发者提供了强大的…...

编程日记 2025/5/12 17:59:20

EF Core配置及使用

Entity Framework Core是微软官方的ORM框架。 ORM：Object Relational Mapping。让开发者用对象操作的形式操作关系数据库。 EF Core是对于底层ADO.NET Core的封装，因此ADO.NET Core支持的数据库不一定被EF Core支持。代码创建数据库Code First 建实…...

编程日记 2025/5/14 2:38:21

EPS32基础篇开发

提示：文章写完后，目录可以自动生成，如何生成可参考右边的帮助文档开发 EPS32基础篇前言一、GPIO输入输出GPIO可设置一下4种状态代码示例：检测按键，按下时：LED亮，松开时，LED灭二、…...

编程日记 2025/5/10 20:22:38

一、基本配置

1、5大核心概念

1）entry （入口）

2）output（输出）

3）loader（加载器）

4）plugins（插件）

5）mode（模式）

2、配置文件

二、开发模式介绍

三、处理样式资源

1、介绍

2、处理 css 资源

1）下载包

2）功能介绍

3）配置

3、处理 less 资源

1）安装

2）配置(webpack.config.js)：

4、处理 scss/sass 资源

1）安装

2）配置

5、处理 Styl 资源

1）安装

2）配置

四、处理图片资源

1、配置

2、修改不同资源的输出目录，比如图片到 image， css 到 css 文件夹

3、自动清空上次打包的内容

五、处理字体图标资源

1、下载字体图标并引入到 main.js 中

六、处理 js 资源

1、Eslint

1.1 配置文件

1.2 具体配置

相关文章：