- 博客(140)
- 收藏
- 关注
RSS订阅原创 Vue 虚拟列表优化指南：提升 PC 端海量卡片渲染体验
本文详细介绍了在PC端后台管理系统中实现Grid布局虚拟滚动的技术方案。通过vue-virtual-scroller组件结合CSS Grid布局，解决了海量卡片数据渲染卡顿的问题。文章重点解析了核心属性配置、事件规范使用，并提供了完整的实现代码，包括全局注册、分组数据处理、固定4列布局的实现方法，以及加载更多功能的实现。该方案通过虚拟滚动仅渲染可视区域卡片，显著提升了大数据量列表的加载速度和滚动流畅度，适用于PC端数据可视化等高性能要求的场景。
2026-01-28 15:31:33
665
原创 四、CRUD操作指南
本文档详细介绍了在Spring Boot + MyBatis框架下实现CRUD操作的方法，基于yuppie项目的用户管理模块(SysUser)。内容涵盖技术栈(Java 17/Spring Boot 4.0.1/MyBatis 3.0.3/MySQL 8.0)、项目结构说明、实体类创建与注解使用、Mapper接口定义及MyBatis映射文件配置。重点展示了用户实体类的字段定义与验证注解，以及增删改查等基础数据库操作的接口声明和XML映射实现。
2026-01-20 10:41:01
467
原创 三、后端框架搭建完全指南
Java后端框架搭建指南摘要 本教程为零基础开发者提供完整的Java后端框架搭建指南。主要内容包括： 环境准备：详细讲解JDK、Maven、MySQL和IDE的安装配置步骤，包括环境变量设置和国内镜像配置。 核心技术栈：介绍Spring Boot框架（简化开发）、MyBatis（数据库访问）、Shiro（安全认证）和MySQL等核心组件及其优势。 学习路径：从环境搭建到项目配置，再到数据库连接和接口开发，提供循序渐进的实践指导。 工具推荐：包含IntelliJ IDEA、Navicat等开发工具的选择建议。
2026-01-19 09:06:09
679
原创 二、前端与Java后端对比指南
《前端转Java后端开发指南》摘要： 本文为前端开发者提供Java后端学习路线，重点突出前后端技术对比和转换优势。前端开发者已具备HTTP协议、JSON数据格式、MVC模式等基础，学习后端更有优势。指南包含： 技术栈对比表（语言、框架、工具等） 思维差异分析（前端关注UI/UX，后端关注数据安全与业务逻辑） 交互流程详解 JavaScript与Java语法对比（变量、函数、类等） 常见错误提醒（类型转换、空指针等） 前端已有优势说明（HTTP理解、调试能力等） 150字
2026-01-19 08:58:35
977
原创 三、前端规范化 项目代码规范
为所有变量、函数参数和返回值定义类型避免使用any类型使用接口定义复杂类型// 正确id: number;age?: number;// 错误命名规范组件使用 PascalCase变量使用 camelCase常量使用 UPPER_SNAKE_CASE代码格式2 空格缩进双引号行尾分号120 字符行宽TypeScript定义所有类型尽量避免使用 any使用接口定义复杂类型Vue 3使用定义 Props 和 Emits使用 scoped 样式。
2026-01-16 11:23:34
676
原创 二、前端规范化 遇到的问题及解决方案
配置文件格式问题ESLint v9+ 使用扁平配置格式Prettier 使用 CommonJS 格式VSCode 使用 JSON 格式依赖包版本问题ESLint v9+ 与旧版本配置不兼容Vue ESLint 插件需要正确配置Prettier 和 ESLint 需要配合使用编辑器配置问题VSCode 需要正确配置插件配置文件路径要正确自动格式化和代码修复要开启。
2026-01-16 11:22:42
576
原创 一、前端规范化 Prettier + ESLint + Husky 安装配置指南
ESLint v9+ 使用 ES module 格式。Prettier 配置文件格式不正确。Husky 钩子未正确安装。VSCode 配置不正确。
2026-01-16 11:21:55
348
原创 一、Mac 下 JDK + Maven 安装配置文档（Bash 终端 / Source 生效）
Mac 下 JDK + Maven 安装配置文档（Bash 终端 / Source 生效
2026-01-15 11:49:59
697
2
原创 VS Code 代码片段使用指南
代码片段（Code Snippets）是 VS Code 提供的一种快速生成常用代码模板的功能。通过输入特定的前缀（Prefix），然后按下 Tab 键，就可以快速插入预定义的代码模板，大大提高开发效率。
2026-01-09 10:36:52
1062
原创 超详细 Vue CLI 移动端预览插件实战：支持本地/TPGZ/NPM/Git 多场景使用（小白零基础入门）
你是否还在为「移动端如何快速预览本地 Vue 开发项目」而烦恼？手动查找局域网 IP、输入端口号繁琐又容易出错？本文将围绕「**实现移动端便捷预览本地服务项目**」这一核心需求，手把手教你开发一款 Vue CLI 专属二维码插件。插件不仅能自动生成移动端可扫码的二维码，还完美支持本地调试、TGZ 压缩包、NPM 公开包、Git 仓库四种使用场景，同时附带解决插件开发中「二维码输出时机」的常见问题，代码可直接复制，小白也能轻松上手！
2025-12-30 16:29:59
843
原创 !!告别重复造轮子！一文搞定如何搭建跨 Vue2/Vue3 的 Element 增强组件库
本文档提供一套「跨 Vue2/Vue3 技术栈」的自定义 el-table 组件库完整解决方案，核心升级点：Vue2 版本采用 Rollup 打包（替代原 Webpack，解决高版本 Node.js 兼容问题、产物更精简），Vue3 版本保持 Vite 打包，同时实现：二次封装 ElementUI/Element Plus 的 el-table 组件，集成通用功能（分页、多选、树状结构、操作列）；集成 af-table-column（Vue2）/af-table-column-vue3（Vue3）增
2025-12-26 15:08:03
1469
原创 解决 TypeScript 找不到静态资源模块及类型声明问题
在 Vue + TypeScript 项目中，导入 @/assets/img/logo.png 这类静态资源时，经常会遇到 找不到模块“@/assets/img/logo.png”或其相应的类型声明 的 TS 报错（错误码 ts-plugin(2307)）。本文将从 问题根源、分步解决方案、缓存清理、兜底方案 四个维度，给出一套可直接复用的完整解决流程
2025-12-25 15:52:00
566
原创 CSS 常用特效汇总
CSS 特效是提升页面视觉体验与交互质感的核心手段，无需依赖 JS 即可实现多种动态与静态效果。本文整理了开发中高频使用的 CSS 特效，涵盖视觉交互、布局动效、氛围营造三大类，每类包含具体特效的实现代码、核心原理及适用场景，便于直接复用与灵活扩展
2025-12-24 14:06:14
1001
原创 告别繁琐！这些CSS简写/新属性大幅精简代码
在前端开发中，传统 CSS 多属性组合的写法常导致代码冗余、可读性差、维护成本高。本文系统总结了能替代繁琐写法的 CSS 简写属性与新属性，按“布局定位”“视觉样式”“交互控制”“通用工具”四大核心场景分类，每类包含属性功能、简化对比、核心用法、适用场景及关键注意事项，帮助开发者高效精简代码、提升开发效率
2025-12-24 12:14:28
1232
原创 五、NestJS 开发实战文档--＞redis
本文基于 `@nestjs-modules/ioredis` 模块实现 NestJS 与 Redis 的无缝集成，以**验证码生成、存储、验证**为实战场景，提供标准化、可扩展的配置方案，同时优化了全局模块、环境变量配置、类型安全等核心细节，支持生产环境直接复用。
2025-12-23 10:36:48
747
原创 三、NestJS 开发实战文档--＞集成 MySQL（TypeORM）
全局模块化标记为全局模块，所有业务模块无需重复导入，简化配置TypeORM 强集成：通过快速实现数据库连接，支持实体映射、查询构建器等强大功能安全可靠：密码字段默认不返回（），开发/生产环境配置隔离（开关）易于维护：实体类与数据库表一一映射，目录结构清晰，业务逻辑与数据操作分离功能灵活：支持一对一关联查询、动态 SQL 构建，满足复杂业务场景需求。
2025-12-23 10:34:48
702
原创 四、NestJS 开发实战文档--＞NestJS JWT 登录功能（含登录信息存储）
本次实现基于 NestJS 搭建标准化 JWT 登录认证体系，核心功能包括：1. 用户账号密码校验（基于 bcrypt 密码加密）2. JWT 令牌生成与过期配置3. 登录信息（设备、IP、令牌、登录时间等）持久化到 `user-login` 表4. JWT 策略验证（用于接口权限守卫）5. 统一异常处理、环境变量配置优化6. 类型安全强化与代码可维护性提升
2025-12-23 10:31:49
785
原创 一、NestJS 开发实战文档--＞基础篇
本文档完整覆盖了 NestJS 项目开发的核心流程：项目初始化与 CLI 工具使用，快速生成组件；全局路由前缀与接口版本控制，规范接口路径；Swagger API 文档集成，方便接口自测与对接；环境变量配置（单环境/多环境/变量扩展），提高项目可配置性；全局响应拦截器，统一接口返回格式；全局异常过滤器 + 自定义业务异常，统一错误处理逻辑；接口示例实现，验证所有配置有效性
2025-12-23 10:24:39
1208
原创 Web常见安全漏洞全解析（含案例+前后端实操防御方案）
本文系统梳理了 Web 应用开发中最常见的 10 大类安全漏洞，包括 SQL 注入、XSS 攻击、CSRF 攻击、DDoS 攻击、DNS 劫持、JSON 劫持、点击劫持、OS 命令注入、URL 跳转漏洞及暴力破解、信息泄露等典型场景。针对每类漏洞，均从 “核心说明”“攻击案例”“防御方案”“实操步骤” 四个维度展开，明确漏洞触发机制、还原真实攻击场景，并提供前后端协同的可落地防护措施 —— 涵盖代码层面的参数校验、加密脱敏、权限控制，服务器层面的配置优化、限流防护，以及运维与用户层面的安全规范。文档整合了
2025-12-15 11:43:16
1088
原创 Web前端移动端开发常见问题及解决方案（完整版）
移动端Web开发因设备碎片化（屏幕尺寸、分辨率、系统版本）、交互特性（触摸、手势）、网络环境及浏览器内核差异，易出现布局错乱、交互异常、兼容性差、性能卡顿等问题。本文全面梳理高频问题，覆盖布局适配、交互体验、兼容性、性能优化四大维度，包含iOS/安卓特有坑点（如vh/svh/dvh适配），并提供可落地的解决方案。
2025-12-12 09:52:28
915
原创 Nuxt项目内网服务器域名代理访问故障排查
本文针对Nuxt项目在**本地运行正常、打包无异常**，但部署至内网服务器后出现接口访问异常、资源加载失败的问题，梳理故障背景、排查流程及解决方案，为技术人员解决同类内网环境下的代理配置故障提供参考。
2025-12-11 16:52:58
956
原创 利用 PHPStudy（Mac 版）部署 Nuxt3 node-server 模式项目完整教程
本文针对 Mac 系统下的 PHPStudy（含小皮面板 XP.CN），详细讲解如何部署 Nuxt3 node-server 模式产物。node-server 模式是 Nuxt3 默认的服务端部署方式，依赖 Node.js 环境运行，支持 SSR 服务端渲染、服务端接口代理、动态路由等核心能力，PHPStudy 在此过程中主要承担「反向代理」角色，实现自定义域名 / 端口访问 Nuxt 服务。
2025-12-11 16:09:43
1069
原创 前端依赖版本约束与冲突解决通用文档
本文档旨在讲解前端项目中`package.json`里依赖版本约束的核心规则（如`~`/`^`/`*`等符号），并提供依赖版本冲突的通用排查、解决方法，适用于npm/yarn/pnpm等主流包管理器，覆盖日常开发中版本相关的常见问题。
2025-12-11 11:36:55
713
原创 Vue3 + Element Plus 表格导出Excel 通用工具文档
该工具基于 `xlsx` 库封装，提供 Vue3 + Element Plus 场景下 `el-table` 数据导出 Excel 的通用解决方案，支持「数组数据导出」（推荐）和「DOM 表格导出」（兼容分页/筛选场景）两种模式，具备参数可配置、错误处理、格式兼容等特性。
2025-12-10 14:03:08
775
原创 Vue 3 + Vite + Router + Pinia + Element Plus + Monorepo + qiankun 构建企业级中后台前端框架
在现代前端开发中，中后台项目面临着业务复杂度提升、团队协作紧密、系统扩展性要求增高的挑战。本文将详细介绍如何整合 Vue 3、Vite、Router、Pinia、Element Plus、Monorepo 和 qiankun 等前沿技术，搭建一个高性能、可维护、易扩展的企业级中后台前端框架，为复杂业务系统提供坚实的技术支撑
2025-11-25 17:16:46
1213
1
原创 5 分钟实现 Web 电子签名！支持 PC + 移动端，一键保存无后端依赖✨
5 分钟实现 Web 电子签名！支持 PC + 移动端，一键保存无后端依赖✨无需复杂配置，用 HTML5 Canvas+jQuery 就能快速搭建实用电子签名工具！支持鼠标 / 触摸双端绘制，自带清空重签、PNG 图片导出功能，轻量无冗余代码，新手也能直接复制使用。不管是表单签署、合同确认还是日常办公场景，这个极简方案都能直接嵌入 Web 项目，零成本实现专业电子签名效果～
2025-11-06 11:25:59
800
原创 VSCode 配置优化：Vue3 开发提效指南
以下整合了 Vue3 + TS 开发中高频用到的代码片段、自动格式化、语法提示等配置，统一放在项目根目录的 `.vscode` 文件夹下（若没有该文件夹，先新建），提升开发效率。
2025-09-19 16:45:25
409
原创 vue excel转json功能 xlsx
通过上述步骤，可实现对嵌套规律表格的解析：读取 Excel 并转换为行数组；根据空行或特定标识识别子表格范围；提取每个子表格的表头和数据，映射为 JSON 对象；按需处理合并单元格和数据类型。根据实际 Excel 结构，只需调整边界识别逻辑和表头映射规则即可适配不同场景。
2025-08-12 15:06:50
697
原创 解决electron+vue-router在history模式下打包后首页空白问题
优先选择 hash 模式：在 Electron 等本地应用中，hash模式（）兼容性更好，无需额外配置。history 模式必备配置：若使用 history 模式，必须同时设置base: './'、通配符路由和 Vite 相对路径打包。通过以上配置，可确保 Electron 打包后，Vue Router 能正确匹配首页路径，解决空白问题。
2025-07-25 12:20:24
807
原创 electron中IPC 渲染进程与主进程通信方法解析
方法通信方向同步 / 异步是否需要返回结果主进程处理方式send渲染 → 主进程异步不需要ipcMain.onon主进程 → 渲染异步接收结果配合invoke渲染 → 主进程异步需要（请求 - 响应）sendSync渲染 → 主进程同步需要（阻塞）ipcMain.on。
2025-07-25 11:56:22
659
原创 实现一个可插入标签的聊天框
div 设置 contenteditable=“true” 时插入新 div 会换行，主要是因为 div 是块级元素（block-level），默认会独占一行。解决这个问题需要结合 CSS 调整元素显示方式和 JavaScript 精确控制插入行为。
2025-07-23 10:06:49
556
原创 解决：Error: Electron failed to install correctly, please delete node_modules/electron and try installi
供的错误信息，Electron 安装仍然不完整，导致 Node.js 找不到 Electron 的 CLI 模块。这通常是由于下载中断或文件损坏引起的。
2025-07-16 12:18:58
741
原创 本地包解决npm error code E404
E404 错误：npm 找不到你指定的包，因为它尚未发布npm create 命令需要包已存在于 npm 注册表中本地开发时应使用 npm link 和命令行直接调用。
2025-07-09 09:24:22
588
原创 Vuex 自动化生成工具
Vuex 自动化生成工具 为提升前端开发效率，减少重复代码编写，需开发一个自动化工具，根据输入参数自动生成完整的 Vuex 存储模块（包括 api.js、mutation-types.js、mutations.js、getters.js 和 actions.js）
2025-06-10 14:31:45
992
原创 别让 HTTPS 阻塞开发！Vite 一键打通浏览器访问https
在 Vue Vite 项目开发中，运行 HTTPS 时浏览器无法访问是困扰许多开发者的常见难题。本内容聚焦这一痛点，提供从临时证书生成到自定义证书配置的全流程解决方案，涵盖 Vite 配置优化、浏览器证书信任设置等关键步骤。无需复杂操作，通过清晰易懂的指引，助你快速解决 HTTPS 连接障碍，让浏览器顺畅访问项目，为开发调试和生产部署筑牢安全基础。
2025-06-09 17:21:03
1072
原创 vue 多端适配之pxtorem
在 Vue 3 + Vite 项目中使用 postcss-pxtorem 自动将 px 单位转换为 rem 单位
2025-06-04 14:33:31
1329
1
空空如也
TA创建的收藏夹 TA关注的收藏夹
TA关注的人