自定义博客皮肤VIP专享

*博客头图:

格式为PNG、JPG,宽度*高度大于1920*100像素,不超过2MB,主视觉建议放在右侧,请参照线上博客头图

请上传大于1920*100像素的图片!

博客底图:

图片格式为PNG、JPG,不超过1MB,可上下左右平铺至整个背景

栏目图:

图片格式为PNG、JPG,图片宽度*高度为300*38像素,不超过0.5MB

主标题颜色:

RGB颜色,例如:#AFAFAF

Hover:

RGB颜色,例如:#AFAFAF

副标题颜色:

RGB颜色,例如:#AFAFAF

自定义博客皮肤

-+
  • 博客(587)
  • 收藏
  • 关注

原创 全栈项目,从 0 到 1,前后端分离,前端 Vue 3 + TypeScript + Vite + VS code,后端 Spring Boot 3 + Java + Maven + IDEA

Vue - Official 插件是 Vue.js 开发者不可或缺的工具,它通过提供丰富的功能如语法高亮、智能感知、错误检查以及最新的模板插值高亮专注模式和响应性可视化,极大地提升了开发效率和体验。关键操作提醒安装后务必禁用 Vetur插件以避免冲突。根据需求在设置中勾选以实现 ref 的自动补全。结合ESLintPrettier等插件可以获得更完善的开发环境。Vue VSCode Snippets 是一款专为 Vue.js 开发者设计的 Visual Studio Code 扩展工具,它通过提供大量。

2025-09-15 08:06:08 32

原创 IDEA Lombok 插件详解

Lombok 插件通过注解自动化了 Java 开发中许多繁琐的样板代码编写,显著提升了开发效率和代码的可读性。适用场景:POJO 实体类、DTO、配置类、需要大量样板代码的类。使用建议按需使用注解:避免滥用@Data,根据实际需要选择更精确的注解组合。团队统一:在团队项目中,确保所有成员都安装并配置了 Lombok 插件,以避免代码不一致问题。了解原理:明白 Lombok 是通过在编译期修改 AST(抽象语法树)来生成代码的,这有助于理解其工作方式和潜在限制。

2025-09-15 01:10:16 211

原创 Nginx官网及资源推荐

Nginx 是一款高性能的 HTTP 和反向代理服务器,以其稳定性、丰富的功能集、简单的配置和低系统资源消耗而闻名。它能够高效处理静态资源、作为反向代理服务器、实现负载均衡,并且支持热部署等特性。:集成了强大的 LuaJIT VM,允许使用 Lua 脚本扩展 Nginx 的功能,常用于构建高性能的 Web 应用和网关。如果你需要企业级的特性(如主动健康检查、高级监控、技术支持等),则可以关注。:由淘宝网发起的项目,在 Nginx 基础上添加了更多高级功能和特性。获取软件和查阅文档就足够了。

2025-09-15 01:08:57 92

原创 IntelliJ IDEA社区版创建Spring Boot项目方法

- 根据你的JDK版本调整,推荐 17 或 21 --><artifactId>my-springboot-app</artifactId> <!-- 替换成你的项目ID -->-- Spring Boot 推荐打 jar 包 -->-- 建议使用当前最新的稳定版本 -->-- 替换成你的组ID -->-- 2. 添加 Spring Boot Web Starter 依赖 -->-- 4. 添加 Spring Boot Maven 插件 -->-- 1. 继承 Spring Boot 的父项目 -->

2025-09-15 01:08:24 134

原创 JVM(HotSpot JVM)与 GraalVM 对比分析

特性JVM (以HotSpot为例)GraalVM角色Java字节码的运行平台。它负责加载、验证、执行Java编译后的.class字节码,并提供内存管理(垃圾回收)、线程管理等运行时环境。一个高性能的多语言运行时平台。它不仅可以运行JVM字节码,还能运行其他语言(如JS, Python, Ruby),并提供了将字节码提前编译为本地可执行文件的能力。本质一个规范(JVM Specification)和该规范的一个参考实现(通常指Oracle的HotSpot JVM)。一个项目或产品。

2025-09-15 01:07:04 134

原创 Maven与Gradle对比分析

工具哲学优势劣势Maven约定优于配置简单、稳定、生态成熟、易于上手配置冗长、不够灵活、构建慢Gradle灵活性至上极高性能、高度灵活、脚本简洁强大学习曲线较陡、配置可能变得复杂发展趋势:Gradle凭借其卓越的性能和灵活性,已经成为许多新项目(特别是Android和大型Java项目)的首选,并且在整个生态中的采用率持续增长。然而,Maven凭借其稳定性和简单性,在众多传统企业级项目中依然占据着牢固的地位。两者都是非常优秀的工具,选择最适合你项目和团队的那个才是关键。

2025-09-15 01:04:49 438

原创 DSL、Groovy DSL、Kotlin DSL 详解

特性Groovy DSLKotlin DSL本质利用 Groovy动态语言特性构建的 DSL利用 Kotlin静态语言特性构建的类型安全 DSL类型系统动态类型静态类型IDE 支持较弱(补全、导航、重构、错误检查)极佳(得益于静态类型)性能运行时解释,通常较慢编译为字节码,通常更快灵活性极高,可以实现非常动态和简洁的语法高,但在动态魔法方面不如 Groovy学习曲线需要学习 Groovy 的独特语法和 DSL 技巧如果你会 Kotlin,就很容易理解其 DSL 机制经典案例。

2025-09-15 01:03:50 751

原创 VS Code Mithril Emmet 插件详解

Mithril Emmet 插件是 Mithril.js 开发者提升开发效率的实用工具。它通过熟悉的 Emmet 缩写语法减少了手动编写虚拟 DOM 结构的时间。主要优点包括:高效开发:大幅减少重复编码。语法准确:自动生成符合 Mithril 语法的代码。高度可定制:支持自定义缩写和输出配置。

2025-09-15 00:58:40 478

原创 VS Code File Utils 插件详解

VS Code File Utils 插件是一款轻量级、功能专注且提高效率的得力助手。它解决了开发过程中常见的文件管理痛点,通过简化的操作流程让你能更加专注地进行编码工作。如果你经常需要在 VSCode 中进行创建、复制、移动、重命名或删除文件等操作,那么尝试安装 File Utils 插件会很值得。

2025-09-15 00:57:32 370

原创 VS Code open in browser 插件详解

Open in Browser 是 Visual Studio Code 中一款非常受欢迎的插件,它允许你直接在浏览器中打开HTML文件,无需手动从文件系统或通过其他复杂方式打开。这对于前端开发者来说非常方便,可以快速预览网页效果。插件是一个轻量级、易用的工具,它极大地简化了在浏览器中预览HTML文件的过程,适合快速查看静态页面的基本效果。如果你在进行需要本地服务器环境或希望实现保存后自动刷新预览的开发(例如使用JavaScript AJAX请求或某些框架),你可能需要。

2025-09-15 00:56:02 457

原创 VS Code HTML CSS Support 插件详解

你可以按住Ctrl(或Cmdon Mac) 并单击一个类名或 ID,VS Code 会直接跳转到该选择器在 CSS/SCSS 文件中的定义位置。这是理解和维护代码的利器。功能描述带来的好处智能提示自动补全 HTML 中的class和id减少手动输入,避免拼写错误路径补全自动补全<link>标签中的 CSS 文件路径快速链接样式表,无需记忆路径跳转定义从 HTML 的类名跳转到 CSS 中的定义快速定位和修改样式,提高维护性悬停预览悬停显示 CSS 规则内容无需跳转文件即可查看样式多格式支持。

2025-09-15 00:53:59 412

原创 初建 Spring Boot 3 + Java + Maven + IDEA 项目

OpenJDK 官网,这里是 OpenJDK 开源项目的源头,,它更多是提供项目信息、源码和指向其他提供预构建二进制文件的站点的链接。安装包安装(自动设置环境变量,最好查核一下) 或 解压安装(手动设置环境变量)

2025-09-15 00:45:49 606

原创 VS Code JavaScript (ES6) code snippets 插件详解

JavaScript (ES6) code snippets 插件为 JavaScript、TypeScript、React(JSX/TSX)、HTML 和 Vue 等多种文件类型提供了大量常用的 ES6 及后续版本的语法代码片段。其核心价值在于让开发者通过简单快捷方式输入,就能生成重复性较高的代码结构。安装方法打开 VS Code。使用快捷键(Windows/Linux) 或(Mac) 打开命令面板。输入 "Extensions: Install Extensions" 并选择该命令。

2025-09-14 15:14:26 462

原创 VS Code IntelliJ IDEA Keybindings 插件详解

是一款用于 Visual Studio Code 的免费插件,它将 JetBrains IntelliJ IDEA 及其系列 IDE(如 WebStorm、PyCharm、PHP Storm 等)的键盘快捷键映射到了 VS Code 中。如果你习惯了 IntelliJ IDEA 的快捷键操作,这个插件能显著降低你切换编辑器时的学习成本,帮助保持编码效率和工作流的连续性,使得在不同开发环境间切换更加顺畅。从 IntelliJ IDEA 导出配置:在 IntelliJ IDEA 中,通过导出设置,请确保勾选了。

2025-09-14 15:13:22 734

原创 VS Code VS Code Counter 插件详解

VS Code Counter 是一款方便开发者统计项目代码行数的 VS Code 插件。它可以帮助你快速了解项目的代码量、各种文件类型的分布以及代码的组成(如纯代码行、注释行和空白行)。下面我来为你详细介绍一下这个插件的功能和使用方法。

2025-09-14 15:12:26 446

原创 VS Code Lingma - Alibaba Cloud AI Coding Assistant 插件详解

总而言之,通义灵码是一款功能全面、易于上手且对中文开发者非常友好的AI编程助手。无论是快速的代码补全、解释陌生代码、生成测试用例,还是解决复杂的编程问题,它都能提供有力的支持。

2025-09-14 15:11:09 487

原创 VS Code ESLint 插件详解

你可以在 ESLint 配置文件的rules部分灵活地自定义规则。"off"或0- 关闭规则。"warn"或1- 将规则视为警告(不会导致 ESLint 失败)。"error"或2- 将规则视为错误(会导致 ESLint 以错误状态退出)。许多规则还允许额外的配置选项。javascriptrules: {'no-console': 'warn', // 使用 console 会警告'semi': ['error', 'always'], // 强制分号,否则报错。

2025-09-14 15:09:54 348

原创 VS Code Prettier - Code formatter 插件详解

VS Code 的 Prettier - Code formatter 插件是一款强大的代码格式化工具,它能自动规范代码风格,让你和团队能更专注于逻辑本身而非风格争论。下面我来为你详细介绍一下这个插件的使用方法和技巧。

2025-09-14 15:09:00 662

原创 VS Code Code Spell Checker 插件详解

Code Spell Checker 提供了丰富的配置选项,可以通过 VS Code 的设置 (Ctrl+,或Cmd+,) 进行修改,推荐直接编辑文件。以下是常用的配置示例:json// 设置要检查的语言// 添加自定义单词(全局)// 添加工作区特定单词// 忽略的单词// 启用检查的文件类型"html","python"],// 忽略的文件路径// 启用复合词你也可以在项目根目录创建文件进行项目级配置,建议通过.gitignore忽略该文件,使其仅在本机生效。

2025-09-14 15:07:31 532

原创 VS Code Auto Rename Tag 插件详解

插件是 VS Code 中一款轻量级但极其实用的扩展,特别适合经常与 HTML、XML 或 JSX 打交道的开发者。它能有效避免手动修改标签时可能出现的遗漏或错误,减少重复劳动,提高编码效率和准确性。虽然现代编辑器不断集成新功能,但这款插件因其简单可靠,仍然是许多前端开发者工具箱中的必备品之一。

2025-09-14 15:06:40 425

原创 VS Code Auto Close Tag 插件详解

VS Code 的插件是一个轻量级但极其实用的工具,它通过自动化标签闭合这一重复性操作,显著减少了开发者的输入工作量,并有助于保持代码结构的完整性,避免因遗漏闭标签而引发的错误。无论是初学者还是经验丰富的开发者,都能从中获得编码效率的提升。

2025-09-14 15:05:37 395

原创 VS Code Path Intellisense 插件详解

Path Intellisense 是 VS Code 生态中一款强大且实用的插件,它通过智能路径补全和别名映射,极大地提升了开发效率,减少了因手动输入路径而导致的错误。无论是小型项目还是大型企业级应用,它都能游刃有余。智能化提示:大幅减少路径输入时间和错误。高度可定制化:通过灵活的配置适应不同项目和开发习惯。生态融合性好:与 TypeScript、JavaScript、Webpack 等工具链无缝集成。多语言支持:不局限于 JS/TS,前端后端都能用。

2025-09-14 15:04:46 569

原创 VS Code Vue 3 Snippets 插件详解

Vue VSCode Snippets 是一款专为 Vue.js 开发者设计的 Visual Studio Code 扩展工具,它通过提供大量预设代码片段,帮助开发者快速生成常见代码结构。这款插件全面支持Vue 2 和 Vue 3,无论你使用的是 Options API 还是 Composition API,甚至是带有语法的单文件组件,都能找到对应的快捷方式。如果插件自带的片段不能满足你的所有需求,你完全可以创建自己的代码片段:在 VSCode 中,通过。

2025-09-14 15:03:48 527

原创 VS Code Vue (Official) 插件详解

Vue - Official 插件是 Vue.js 开发者不可或缺的工具,它通过提供丰富的功能如语法高亮、智能感知、错误检查以及最新的模板插值高亮专注模式和响应性可视化,极大地提升了开发效率和体验。关键操作提醒安装后务必禁用 Vetur插件以避免冲突。根据需求在设置中勾选以实现 ref 的自动补全。结合ESLintPrettier等插件可以获得更完善的开发环境。

2025-09-14 15:02:53 629

原创 初建 Vue 3 + TypeScript + Vite + VS Code 项目

构建的开源、跨平台的 JavaScript 运行时环境,主要用于服务器端编程。它允许开发者使用 JavaScript 编写高性能的后端服务,突破了 JavaScript 仅在浏览器中运行的限制。npm(Node Package Manager),通常需要先。,因为 npm 是 Node.js 的默认包管理工具。查看本地 Node.js 的版本。Node.js 是一个基于。查看 npm 的版本。

2025-09-14 11:19:51 181

原创 Vue3项目工程目录过大问题分析

检查:使用上面提供的命令,找出到底是哪个文件夹占用了 300MB。分类处理->正常,但可优化。考虑切换到pnpm。distbuild->可删除。检查.gitignore。.git->正常,勿动。缓存文件->可酌情删除。日常好习惯使用.gitignore文件忽略不必要的目录(dist*.log.DS_Store等)。使用pnpm作为包管理器来节省空间和提升速度。定期审视项目依赖,保持的整洁。所以,300MB 本身不是一个“错误”,而是一个需要你关注的“信号”。

2025-09-14 09:39:27 396

原创 Spring Boot 中 Validation 数据校验依赖作用详解

Spring Boot Validation 依赖的作用可以概括为:声明式校验:通过注解简化代码,使校验规则清晰直观。提高开发效率:省去大量手写校验代码的时间。提升代码可维护性:校验逻辑与业务逻辑分离,代码更整洁。保证数据安全与正确性:在数据进入业务逻辑之前就将其拦截,防止“垃圾进,垃圾出”。标准化:遵循 Java Bean Validation 标准,技术通用,易于理解。友好的错误反馈:与异常处理机制无缝集成,提供统一的错误响应格式。

2025-09-14 08:31:11 389

原创 Vue3应用执行流程详解

步骤SPA (Vite 开发模式)SPA (构建后)SSR (如 Nuxt.js)1. 请求处理Vite 开发服务器返回空的index.htmlNginx 返回空的index.htmlNode.js 服务器执行 Vue,渲染出带内容的 HTML2. 内容渲染浏览器执行 JS,Vue 在客户端渲染浏览器执行 JS,Vue 在客户端渲染服务器渲染好HTML,浏览器直接显示3. 后续交互客户端路由,无刷新切换组件客户端路由,无刷新切换组件客户端激活后,变为无刷新切换最关键的是要理解。

2025-09-13 16:05:18 624

原创 vue3项目启动流程讲解

Vue 3 项目的启动流程相比 Vue 2 有了显著变化,采用了新的应用实例创建方式和组合式 API。下面我将详细讲解 Vue 3 项目的启动过程,并提供一个可视化演示。

2025-09-13 15:01:30 491

原创 Vue3中app.mount(“#app“)应用挂载原理解析

在Vue 3中,这行代码的作用是将Vue应用实例挂载到DOM中的一个指定容器上,从而启动Vue应用。

2025-09-13 12:03:15 530

原创 JavaScript中ES模块语法详解与示例

ES6(ECMAScript 2015)引入了模块系统,这是JavaScript语言层面的模块化方案。下面我将详细讲解ES模块的语法和使用方法。

2025-09-13 11:35:14 196

原创 Express与Vue3的关系

Express和Vue3都是JavaScript生态系统中非常重要的框架,但它们服务于不同的目的且通常协同工作。下面我将通过一个示例页面来展示它们之间的关系。

2025-09-13 10:31:32 602

原创 Express.js框架简介及使用示例

Express.js 是 Node.js 中最流行的 Web 应用框架,它提供了一系列强大的功能来帮助开发者构建 Web 和移动应用程序。下面我将通过一个简单的示例来展示 Express 的基本用法。

2025-09-13 09:39:32 700

原创 Vue3 中 import 的使用说明

Vue3的导入语法基于ES模块,使用import关键字。关键点:。。用于异步加载。最佳实践:在Vite或Webpack构建工具中使用,确保模块解析正确。优先使用Composition API的命名导入。检查官方文档(Vue3文档)以获取最新语法。

2025-09-13 09:15:08 907

原创 Typora设置页内锚点链接(跳转链接)

在 Typora 中设置页内跳转主要区分两种情况:跳转到标题:直接使用[显示文本](### 标题文本)。跳转到任意位置:需借助 HTML 的<a>标签定义锚点,再用[显示文本](#锚点名称)链接。

2025-09-13 08:21:50 281

原创 CSS 中 white-space 用于控制元素内空白符(空格、制表符、换行符)的处理方式以及文本的换行行为

值空白符处理换行符处理自动换行normal合并忽略是nowrap合并忽略否pre保留保留否pre-wrap保留保留是pre-line合并保留是保留保留是。

2025-09-12 19:31:46 481

原创 vue3 样式 css、less、scss、sass 的说明

缺少编程特性(变量、嵌套、混合等)在Vue单文件组件中,可以通过。浏览器原生支持,无需额外处理。使用JavaScript实现。-- 原生CSS -->缩进语法(无大括号和分号)Sass的CSS兼容语法。支持变量、混合、函数等。在客户端或服务器端编译。与SCSS相同的功能集。

2025-09-12 16:13:25 352

原创 Vue3 的单文件组件(.vue 文件)中,在 <script>、<template>、<style> 标签外输入内容不会导致程序报错

Vue 3 的编译器会忽略.vue文件中<script><template><style>标签外的内容,不会报错也不会包含这些内容到最终代码中。这是为了保持构建过程的鲁棒性,但开发者应避免这种写法以确保代码规范。

2025-09-12 09:23:37 303

原创 Vue3富文本编辑器组件 Tiptap、Quill

在 Vue 3 项目中使用专用的富文本编辑器组件(如 Tiptap 或 Quill)来安全地处理 HTML 内容是个不错的选择。它们通常内置了安全机制或提供了与安全库(如 DOMPurify)集成的方式,能有效防御 XSS 攻击,同时提供良好的编辑体验。💡:没有“最好”的编辑器,只有“最适合”的。选择时请根据你的项目需求、对安全性的要求以及开发团队的熟悉程度来决定。

2025-09-12 08:59:30 853

原创 Vue3 中使用 DOMPurify 对渲染动态 HTML 进行安全净化处理

为了更方便地在模板中使用,你可以创建一个自定义指令:javascript// main.js 或类似文件});在组件中使用自定义指令:vue<template>DOMPurify 是 Vue 3 应用中处理不安全 HTML 并防御 XSS 攻击的强力工具。通过其简单的 API 和灵活的配置,它可以满足多种安全需求。关键在于牢记安全需要多层防御,切勿完全依赖客户端净化。

2025-09-12 08:57:25 651

空空如也

空空如也

TA创建的收藏夹 TA关注的收藏夹

TA关注的人

提示
确定要删除当前文章?
取消 删除