- 博客(257)
- 资源 (5)
- 收藏
- 关注
原创 vite.config.ts 配置使用说明,完整配置示例
vite.config.ts 是 Vite 项目的“中枢神经”,它决定了你的项目如何开发、如何构建以及如何处理各种资源。root 项目根目录 通常为 process.cwd(),如果你的 index.html 不在根目录可修改。base 部署的公共基础路径 ‘/my-app/’ (部署在子路径) 或 ‘./’ (打包后本地打开)为了让你更直观地掌握它,我为你准备了一份开箱即用的完整配置模板,并附带了核心配置项的详细解析。// 项目根目录 (index.html 所在位置)
2026-01-14 18:11:00
116
原创 ubuntu和centos区别对比,使用方式区别对比及示例
这是一场 Linux 世界里“新锐”与“传统”的巅峰对决。Ubuntu 和 CentOS 是目前最主流的两个 Linux 发行版,它们在底层架构、使用逻辑和适用场景上有着本质的区别。为了让你更直观地了解,我为你整理了一份深度对比、使用方式差异以及实操示例。📊 一、 核心区别对比:两大阵营的哲学🛠️ 二、 使用方式区别及示例演示这是你最关心的部分。虽然它们都是 Linux,都能用 Shell 命令,但在安装软件和系统配置上,命令完全不同。这是你日常操作中接触最多的部分。
2026-01-12 23:09:45
504
原创 Gitea和GitLab对比
总之,若追求“开箱即用”的企业级全流程管理,GitLab 是首选;若重视轻量化、低成本和快速上线,Gitea 更优[Gitea 和 GitLab 是两款流行的自托管 Git 服务,但定位和适用场景差异显著。
2026-01-09 13:38:13
309
原创 YAML 格式完整使用说明和各功能对应示例演示
YAML(YAML Ain’t Markup Language)是一种直观的数据序列化格式,适用于配置文件、数据交换等场景。它以易读性和简洁性著称,常用于与编程语言结合使用。通过以上示例,可以掌握 YAML 的核心语法和常见用法。实际应用中建议结合具体工具链(如 Ansible、Docker Compose)深入学习。
2026-01-09 11:12:16
366
原创 jdk1.8 及之后的新版本介绍,新特性示例总结
总的来说,从JDK 1.8的函数式编程革新,到JDK 21+的虚拟线程与模式匹配,Java持续融合现代编程范式。建议生产环境优先选择LTS版本(如17或21),并通过预览特性提前适应未来变化。
2026-01-07 22:25:48
809
原创 IntelliJ IDEA中的项目jdk版本、语言级别版本与目标字节码版本配置说明与步骤示例
通过以上内容,您应该已经掌握了在 IntelliJ IDEA 中配置项目 JDK 版本、语言级别版本以及目标字节码版本的方法和要点。正确的配置对于发挥 Java 不同版本的特性、确保代码质量和可维护性至关重要。在 IntelliJ IDEA 中,合理配置项目的 JDK 版本、语言级别版本以及目标字节码版本,对确保代码的正常运行和兼容性起着关键作用。
2026-01-07 11:51:50
462
原创 xxl-job服务搭建,以及 springboot 集成xxl-job 项目完整步骤示例
通过以上步骤,您可以快速搭建 XXL-JOB 分布式任务调度系统,并在 SpringBoot 项目中无缝集成。XXL-JOB 是一个轻量级的分布式任务调度平台,支持可视化的任务管理、执行和监控。访问地址:http://localhost:8080/xxl-job-admin。的详细步骤(基于最新稳定版 XXL-JOB 2.3.0)。默认账号密码:admin / 123456。
2026-01-06 13:50:02
1081
原创 如何防止XSS攻击绕过Bearer Token?
措施作用✅ Token 存 HttpOnly CookieJS 无法读取,彻底阻断 XSS 窃取✅ 短期 Access Token + 内存存储减少泄露窗口✅ 严格 CSP 策略阻止恶意脚本执行✅ 输出编码 + 安全编码习惯从源头杜绝 XSS✅ 敏感操作二次验证纵深防御🔐终极建议不要把 Bearer Token 存在 localStorage/sessionStorage!优先采用。
2025-12-01 17:09:33
723
原创 API 使用 Bearer Token 为什么可天然防 CSRF
Bearer Token 能天然防御 CSRF,是因为它不依赖浏览器自动携带机制,而是由前端主动、显式地附加到请求中。攻击者无法在跨站请求中注入有效的 Token,因此无法伪造用户身份操作。这正是现代无状态 API(如 RESTful API)普遍采用 Token 认证而非传统 Cookie + Session 的重要安全优势之一。
2025-12-01 17:07:41
539
原创 XSS攻击和CSRF攻击的区别, 完整示例攻击和防御介绍
XSS 是一种注入型攻击,攻击者通过在网页中注入恶意脚本(通常是 JavaScript),当其他用户浏览该页面时,脚本会在其浏览器中执行,从而窃取 Cookie、会话令牌、重定向到钓鱼网站等。CSRF 攻击利用用户已登录的身份,在用户不知情的情况下,诱使其浏览器向目标网站发送恶意请求(如转账、改密码)。浏览器自动携带 Cookie。特性XSSCSRF攻击目标用户(窃取信息、控制浏览器)应用(以用户身份执行操作)是否需要用户交互通常需要(访问含恶意脚本页面)通常需要(访问恶意页面)
2025-12-01 17:06:29
881
原创 CSS中position和display 用法和区别对比
position:适用于需要精确控制元素位置的场景,尤其是动态交互(如滚动吸附、固定定位)。通过是否脱离文档流和参考对象的不同,实现灵活的定位逻辑[5][6display:用于定义元素的布局角色,例如将行内元素强制转为块级以便于设置宽高,或使用 flex/grid 构建复杂排列。其核心在于改变元素的默认布局行为[2][3。
2025-11-18 11:59:08
414
原创 创建Vue2和Vue3项目区别对比和对应示例演示
Vue3 在性能、开发体验和可维护性方面都有显著提升,是现代 Vue 开发的推荐选择。· 现有 Vue2 大型项目可逐步迁移,Vue3 提供兼容性构建。Vue2 与 Vue3 项目创建对比及示例演示。Vue2 入口文件 (main.js)Vue3 入口文件 (main.js)Vue3 项目结构 (Vite)· 新项目建议直接使用 Vue3。方式二:使用 Vite(推荐)方式一:使用 Vue CLI。方式一:使用 Vue CLI。方式二:直接引入 CDN。方式三:直接引入 CDN。
2025-11-12 22:13:22
478
原创 vite创建vue2项目
请注意,尽管这种方法可行,但由于 Vite 本身是为 Vue 3 设计的,某些功能可能无法完全正常工作或需要额外配置。使用 Vite 创建一个 Vue 2 项目并不是一个直接支持的操作,因为 Vite 官方仅支持 Vue 3。不过,你仍然可以通过一些额外的配置来使用 Vite 构建 Vue 2 项目。例如,Vue 3 的 Composition API 不能在 Vue 2 中使用,所以你需要使用 Vue 2 的 Options API。由于我们需要使用 Vue 2,因此需要安装一些额外的依赖。
2025-11-12 21:57:33
354
原创 Bootstrap和BootstrapVue功能对比和使用示例对比
它提供了真正的 Vue 组件,让你能够充分利用 Vue 的数据绑定、响应式状态管理和事件处理机制。这种方式使得代码更模块化、更易维护,尤其适合复杂的单页面应用(SPA),并且它摒弃了对 jQuery 的依赖,让项目更现代、轻量。组件是纯粹的 Vue 组件,支持 Vue 的指令、数据绑定和事件处理。一个将 Bootstrap 的样式和组件与 Vue.js 组件化开发方式相结合的UI组件库。· Bootstrap 的核心优势在于其庞大的预定义样式类,让你通过编写 HTML 就能快速搭建出风格一致的页面。
2025-11-12 07:05:41
824
原创 Vue项目集成bootstrap步骤及动态静态修改属性样式完整示例
至此,你已具备在 Vue 项目中使用 Bootstrap 的完整能力,包括全局引入、按需自定义、静态与动态 class/style 控制。Vue + Bootstrap 完整集成与样式控制示例。二、静态与动态样式控制示例。
2025-11-11 20:07:45
477
原创 bootstrap完整使用方式和示例总结
同时,Bootstrap 的某些组件(如下拉菜单)依赖于 Popper(已包含在 bootstrap.bundle.min.js 中),并且其插件需要 jQuery(Bootstrap 5 已不依赖 jQuery,但早期版本需要)。· 间距 (Spacing):使用 m-* (外边距) 和 p-* (内边距),如 mt-3 (上外边距)、pb-2 (下内边距)。Bootstrap 的网格系统是布局的核心,它将屏幕分成12 列,通过行 (row) 和列 (col) 来创建布局。
2025-11-11 18:59:23
834
原创 bootstrap, element-ui, ant Design 分别适用什么场景以及对应组合的js框架或者库, 如 jquery, vue,react 等
以下是 Bootstrap、Element-UI 和 Ant Design 的适用场景及对应的 JavaScript 框架或库搭配:适用场景搭配的 JS 框架/库适用场景搭配的 JS 框架/库适用场景搭配的 JS 框架/库
2025-11-05 08:33:15
605
原创 Vue 中 <keep-alive> 功能介绍,使用场景,完整使用示例演示
缓存组件实例:“”是 Vue 提供的一个内置抽象组件,用于缓存不活动的组件实例,而不是销毁它们。它自身不渲染任何 DOM 元素,但能保留被包裹组件的状态(包括数据、DOM 状态等),避免重复渲染导致的组件状态丢失[1][5性能优化:通过减少组件的创建和销毁开销来提高应用性能。在频繁切换组件的场景下,使用 “” 可以避免每次都重新加载和初始化组件,从而提升用户体验[1][6灵活的控制方式:提供了includeexclude和max属性来进行更精细的缓存控制。include。
2025-10-29 18:28:24
935
原创 在Vue项目中平滑地引入HTML文件
这是 Vue 推荐的开发方式,适用于大多数项目,尤其是中大型项目。它将 HTML 模板、JavaScript 逻辑和 CSS 样式封装在一个文件中,便于管理和维护代码。:当 HTML 内容存储在单独的文件中,需要在运行时动态加载并显示时可以使用此方法。例如,根据用户的操作或页面状态按需加载不同的 HTML 片段。:适用于需要将静态或动态获取到的 HTML 字符串直接渲染到页面上的情况。:适合于构建灵活的、可复用的组件,允许父组件向子组件传递 HTML 内容,实现内容的分发和定制化。
2025-10-29 17:56:49
978
原创 Vuex 中 mapGetters, mapState 功能介绍,使用场景,使用示例
mapState作用:将 Vuex store 中的 state(状态)映射为组件的计算属性。这样可以直接在组件中通过this访问这些状态,而无需每次都编写。目的:简化代码,提高可读性和可维护性,减少重复性的代码书写。mapGetters作用:将 Vuex store 中的 getters(获取派生状态的方法)映射为组件的计算属性。使得在组件中能够方便地使用这些经过加工处理后的数据。目的:同样是为了简化对 getters 的访问和使用,让代码更加清晰简洁。
2025-10-27 18:23:16
554
原创 vuex的getter使用
state: {todos: [ /* ...待办事项列表 */ ],userInfo: { name: '张三', age: 20 }},getters: {// 单个参数 (默认接收 state)},// 多参数 + 箭头函数简写${state : {todos : [ /* ...待办事项列表 */ ] , userInfo : {name : '张三' , age : 20 } } , getters : {
2025-10-27 18:21:19
614
原创 router-view 和 router-link 跳转加载是刷新本页面还是局部,示例区别对比
在Vue.js应用中,和是两个核心组件,用于实现单页面应用(SPA)内的路由跳转与视图渲染。
2025-10-24 11:55:48
310
原创 如何用router-view实现嵌套路由,完整使用示例
要素作用示例值path路由匹配路径'user''profile'component匹配成功时加载的组件UserLayoutchildren定义子路由子路由的渲染容器放在父组件模板中生成路由链接通过这种方式,你可以构建出清晰的多级路由结构,适用于后台管理系统、电商详情页等复杂场景。
2025-10-23 20:51:47
528
原创 Vue项目页面间,页面中跳转及刷新规划,何时使用router-view,router-link,iframe,slots ,使用场景,及对应场景的完整使用示例
在Vue项目中,页面间的跳转、刷新以及组件的使用规划对于构建高效且用户体验良好的应用至关重要。以下是关于何时使用iframe和slots的详细指导,包括它们的使用场景和完整示例。
2025-10-23 20:28:12
467
原创 vue 项目中 components、views、layout 各个目录规划,组件、页面、布局如何实现合理搭配,实现嵌套及跳转合理,使用完整说明
在Vue项目中,合理规划componentsviews和layout目录结构是构建可维护性高、扩展性强应用的关键。
2025-10-22 17:20:36
961
原创 vue 中 file-saver 功能介绍,使用场景,使用示例
核心作用:“file-saver”是一个轻量级的 JavaScript 库,专门用于在浏览器中保存文件。它提供了简单易用的 API,能帮助开发者轻松实现将数据以文件的形式下载到用户的计算机上的操作,无需后端服务器的参与。支持的文件类型多样:可以使用该库将数据保存为常见的多种文件格式,如文本文件(.txt)、CSV 文件(.csv)、JSON 文件(.json)、Excel 文件(.xlsx)、图片等。基于 Blob 对象工作:通常需要先创建一个包含数据的 Blob 对象,然后使用其提供的saveAs。
2025-10-21 19:34:27
513
原创 vue 中 clipboard 功能介绍,使用场景,完整使用示例
在Vue中,实现剪贴板(clipboard)功能通常借助第三方库来完成,如或等。这些库提供了简单易用的API,允许开发者将文本内容快速复制到用户的剪贴板中,从而提升用户体验。跨浏览器兼容性:支持大多数现代浏览器,无需依赖Flash或其他臃肿的框架。简洁配置:不需要复杂的步骤来配置和使用,大大降低了开发的复杂度。事件回调:提供成功和错误的事件回调函数,方便对复制操作进行反馈和错误处理。灵活集成:可以作为插件全局注册,也可以在单个组件内局部引入和使用。
2025-10-21 16:25:01
387
原创 vue 中 directive 作用,使用场景和使用示例
/ 注册一个全局指令 `v-focus`el.focus();// 当元素被插入到DOM后自动获取焦点});// 在组件中使用该指令<template><input v-focus placeholder="请输入内容...">在这个例子中,我们定义了一个名为v-focus的指令,它会在元素被插入到DOM后自动调用focus()方法,使输入框获得焦点。
2025-10-21 14:57:30
506
原创 moment.js 和 date-fns 功能介绍,使用场景介绍,对应功能点使用示例
综上所述,moment.js功能全面但相对较重,适合复杂且对兼容性要求高的项目;date-fns则以轻量级、模块化和函数式编程为特点,更适合现代前端框架和追求性能优化的场景。在选择时,可根据项目的具体需求来决定使用哪个库。
2025-10-21 13:54:58
534
原创 js 处理数组、对象、等特殊类型操作汇总
JavaScript 提供了丰富的内置方法和技巧来处理数组、对象及其他特殊类型(如nullundefined、日期等)。
2025-10-21 11:50:57
1230
原创 CSS3 全部功能点介绍,使用场景,对应功能点完整使用示例
综上所述,CSS3提供了丰富的功能和特性,极大地拓展了网页设计和交互的可能性。通过合理运用这些功能,开发者可以创建出更加美观、响应迅速且具有良好用户体验的网站和应用程序。
2025-10-21 10:09:55
360
原创 HTML5 功能介绍,使用场景,对应功能点完整使用示例
语义化标签:引入了如<header><footer><nav><article>等具有明确语义的标签,使文档结构更清晰,便于搜索引擎解析和开发者维护[5多媒体支持:内置<video>和<audio>标签,无需依赖第三方插件(如Flash)即可播放音视频内容[4][5图形绘制:提供<canvas>元素用于动态绘制图形,支持2D和3D绘图;以及SVG用于矢量图形展示[5本地存储:引入和,允许在客户端存储大量数据,减少与服务器的交互[5离线应用:通过和Manifest支持离线访问Web应用[5表单增强。
2025-10-20 15:53:10
1390
1
原创 Sortablejs 功能介绍,使用场景,使用完整示例
Sortable.js 是一个现代、轻量级、无依赖的原生 JavaScript 拖拽排序库,压缩后仅约 30 KB,支持现代浏览器和触摸设备,兼容 Vue、React 等主流框架。它允许用户轻松实现列表、表格、网格等元素的拖拽排序,并提供丰富的配置选项和事件回调。
2025-10-18 23:10:27
559
原创 Quill 富文本编辑器 功能介绍,使用场景说明,使用示例演示
文本格式化基础样式:支持加粗、斜体、下划线、删除线等常见的文字效果,可改变字体颜色、背景色,调整字体大小。段落排版:能设置段落的对齐方式(左对齐、居中对齐、右对齐),添加有序或无序列表,方便组织内容结构。标题级别:提供多级标题设置,用于区分不同层次的内容。元素插入链接与图片:允许插入超链接,指向网页或其他资源;也能插入图片、视频等多媒体元素,丰富页面展示形式。代码块:适合插入编程代码片段,并且可以结合语法高亮工具,使代码更易读。引用与表格。
2025-10-16 18:36:09
1273
原创 svg 文件格式,使用方式及使用场景,使用示例
定义:SVG(Scalable Vector Graphics)是一种基于XML的矢量图形格式,由W3C提出并维护。它通过路径、线条、颜色和文本等元素来描述图像内容,而不是像JPEG或PNG那样基于像素点构成[2][4特点:无损缩放,文件体积小,可读可改,支持动画与交互,易于版本控制与协作[2。
2025-10-16 11:12:34
1211
空空如也
TA创建的收藏夹 TA关注的收藏夹
TA关注的人
RSS订阅