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

【2025全网最新最全】前端Vue3框架的搭建及工程目录详解

news 来源：原创 2025/9/13 19:34:53

文章目录

- - 安装软件Node.js
  - 搭建Vue工程
  - 创建Vue工程
  - - 精简Vue项目文件
  - Vue工程目录的解读
  - 网页标题的设置
  - 设置全局样式
  - 路由配置

安装软件Node.js

下载地址：https://nodejs.org/zh-cn/

安装完成后，打开cmd,查看环境是否准备好

node -v
npm -v

npm使用之前一定要配置淘宝镜像源

npm config set https://registry.npmmirror.com

查看镜像

npm config get registry

镜像可能会变，如果改变通过网上查找最新

搭建Vue工程

vue.js官网：https://cn.vuejs.org

vue.js快速上手页面：https://cn.vuejs.org/guide/quick-start.html

前提条件：

使用命令行查看node.js版本

node -v

新建一个文件夹，在文件夹上方搜索栏输入cmd打开当前目录下的cmd窗口

这种打开方式是非管理员方式，如果执行命令时报错，那就是权限问题，就要使用管理员身份运行。

管理员身份运行cmd:

搜索cmd,点击以管理员身份运行

这时候管理员身份打开的是C盘文件夹，我们需要通过cd xxx的方式转到项目所在文件夹。

①先输入D:，转到D盘盘符

然后复制项目所在文件夹的路径，在cmd窗口输入cd,然后再空格，最后粘贴路径，再回车

在这个目录下，我们就可以使用命令创建Vue工程及后续操作了。

创建Vue工程

使用命令创建Vue工程：

npm create vue@latest

然后根据提示运行提供的三行命令

cd vue-project,npm install(也可以简写成npm i),npm run dev

正常启动后，根据系统提供的Local地址，去浏览器打开相应的页面

在命令行页面按两次Ctrl+C关闭正在运行的Vue工程

精简Vue项目文件

在IDEA打开相应的文件夹，删掉一些文件及文件夹，精简项目文件

在IDEA中打开package.json(依赖文件），点击"dev":"vite"旁边的按钮，执行启动，相当于命令行中的npm run dev

编码配置，改为UTF-8,改完一定要Save或Apply

在Inspections—>输入Vue,将原先打勾全部取消勾选，这样就没有红色波浪线的提示。

删除相关文件，将选中的文件删掉（按住Ctrl,然后点击相关文件）

由于删除了某些文件，因此很多文件的代码也要更改

①HomeView.vue

这是原先样式：

由于TheWelcome.vue删除了，这里面import要删除，同时template中的main也要删除

最后，HomeView.vue改名为Home.vue

<template>
<div>主页
</div>
</template><script setup></script>

②App.vue

然后来到App.vue，这里面的原先页面是这样，也需要进行删除和精简

删除无用代码后的页面：

<template><RouterView />
</template>

③router目录下的index.js

修改后的文件：

import { createRouter, createWebHistory } from 'vue-router'const router = createRouter({history: createWebHistory(import.meta.env.BASE_URL),routes: [{path: '/',name: 'home',component: import('../views/Home.vue'),},],
})export default router

④main.js

之前main.css删除了，这里也需要删除import

修改后的代码：

import { createApp } from 'vue'
import App from './App.vue'
import router from './router'const app = createApp(App)app.use(router)app.mount('#app')

现在修改完成后，重新启动，如果出现这样的页面，有出现访问路径，说明修改得没问题

在浏览器打开就是这样一个页面，后续可以根据自己的需求再添加代码，让页面更丰富。

Vue工程目录的解读

Vue工程下面有很多文件夹和文件，下面说明一下他们的作用

node_modules:不是源码文件，是依赖包下载后的存放目录。

public:存放全局静态文件，比如说网页的icon

很多网页有这种小图标（icon文件），这个就要放public后才会显示

src:

assets:存放代码引用的静态文件,比如：css,js,img
- css：存放全局或组件相关的样式文件
- js：存放全局或组件相关的JavaScript文件
- img：存放图片资源（建议进一步细分，如img/icons、img/backgrounds等）
- fonts：存放字体文件（如.ttf、.woff等）
- 其他资源：如svg、json等静态文件
components:放vue的组件(可复用的代码块，就叫组件），是代码复用的核心目录。
- 每个组件应包含.vue文件（或单独的.js、.css文件）
- 组件可以分为公共组件（如按钮、表单、导航栏）和业务组件（如用户的个性化组件）
router:定义路由的目录，用于管理应用的导航和页面跳转
- index.js：路由的核心配置文件，定义路由路径（如/login、/about）以及对应的组件
- 支持按需加载路由（lazy-load）或拆分路由文件（如auth.js、pages.js等）
views:存放vue网页文件的目录
- 每个视图组件对应一个完整的页面（如LoginPage.vue、AboutPage.vue）
- 视图组件通过路由进行导航
App.vue:vue页面全局的入口，所有vue网页进入时都需要先经过它。所有vue文件的父级。
- 通常包含全局的组件（如导航栏、侧边栏、底部栏）
- 提供路由出口（<router-view>）以渲染子页面
- 可以包含全局的状态管理（如 Vuex 的状态）
main.js:代码的配置文件,引入第三方的组件或者我们自己定义的组件，js,css等。
- 引入Vue和相关插件（如Vue Router、Vuex）
- 引入组件库（如Element UI、Ant Design Vue等）
- 注册全局组件或指令
- 创建并导出Vue实例

index.html:vue编译成网页才能在浏览器渲染,是 Vue 应用的起点，浏览器加载这个文件后，Vue 才能开始工作。

jsconfig.json:内部配置文件

package.json:定义依赖库的文件

package-lock.json:下载依赖的时候锁定版本的一个文件(固定版本，防止用户启动后又修改）

vite.config.js:全局的配置文件（Vue3是基于vite的工具来配置的，配置端口之类的，比如我可以配置端口8080，这样启动时就使用8080端口，而不是分配的5173端口）

网页标题的设置

在index.html中修改title标签即可改变网页标题

<!DOCTYPE html>
<html lang=""><head><meta charset="UTF-8"><link rel="icon" href="/favicon.ico"><meta name="viewport" content="width=device-width, initial-scale=1.0"><!--      网页标题--><title>springboot-vue</title></head><body><div id="app"></div><script type="module" src="/src/main.js"></script></body>
</html>

设置全局样式

在src/assets文件夹下面新建文件夹css,css文件夹中新建一个global.css

在global.css添加代码(用于消除边距）

*{box-sizing: border-box;}
body{margin: 0;padding: 0;color: #333;font-size: 14px;
}
a{text-decoration: none;
}

然后在main.js中引入global.css

import './assets/css/global.css'

路由配置

配置404页面，很多时候网页并没有那个路由，用户访问的时候就要跳出404页面提示用户网页不存在

首先在assets目录新建目录imgs,然后将图片放到该目录下

在views文件夹下新建一个404.vue,然后写相应的代码

<template>
<div style="height: 100vh;display: flex;align-items: center;justify-content: center;"><div style="width: 50%"><img style="width: 100%" src="@/assets/imgs/404.png" alt=""><div style="text-align: center;font-size: 20px;color: #0e1986;padding: 20px 0;"><a href="/">返回主页</a></div></div>
</div>
</template>
<script setup lang="ts">
</script>

<template>
<div style="height: 100vh;display: flex;align-items: center;justify-content: center;"><div style="width: 35.5%"><img style="width: 100%" src="@/assets/imgs/404.jpg" alt=""><div style="text-align: center;font-size: 20px;color: #0e1986;padding: 20px 0;"><a href="/">返回主页</a></div></div>
</div>
</template>
<script setup lang="ts">
</script>

【2025全网最新最全】前端Vue3框架的搭建及工程目录详解

文章目录安装软件Node.js搭建Vue工程创建Vue工程精简Vue项目文件 Vue工程目录的解读网页标题的设置设置全局样式路由配置安装软件Node.js 下载地址：https://nodejs.org/zh-cn/ 安装完成后，打开cmd,查看环境是否准备好 node -v npm -vnpm使用之前一定…...

编程日记 2025/9/13 19:34:53

前缀和专题练习 ——基于罗勇军老师的《蓝桥杯算法入门C/C++》

目录一、0求和 - 蓝桥云课算法代码： 代码思路概述代码详细解释数组定义输入读取前缀和计算部分结果计算部分输出结果程序结束总结二、1.可获得的最小取值 - 蓝桥云课算法代码： 代码思路概述详细代码逻辑解释输入初始化 …...

编程日记 2025/9/14 19:24:44

1.测试策略与计划设计指南

1.介绍 1.1项目介绍完整项目组成：1.基于K8S定制开发的SaaS平台；2.多个团队提供的中台服务(微服务)；3.多个业务团队开发的系统平台。涉及多个项目团队、上百个微服务组件。测试在所有团队开发测试后，自己搭建测试环境&#xff0c…...

编程日记 2025/9/8 13:49:24

pikachu

暴力破解基于表单的暴力破解【2024版】最新BurpSuit的使用教程（非常详细）零基础入门到精通，看一篇就够了！让你挖洞事半功倍！_burpsuite使用教程-CSDN博客登录页面，随意输入抓包，发送到攻击…...

编程日记 2025/9/14 19:24:46

HDFS扩缩容及数据迁移

1.黑白名单机制在HDFS中可以通过黑名单、白名单机制进行节点管理，决定数据可以复制/不可以复制到哪些节点。黑名单通常是指在HDFS中被标记为不可用或不可访问的节点列表，这些节点可能由于硬件故障、网络问题或其他原因而暂时或永久性地无法使用。当一…...

编程日记 2025/9/14 6:52:25

设计模式-（状态模式，策略模式，代理模式，责任链模式）

状态模式概念： 用于管理一个对象在不同状态下的行为变化。它允许对象在内部状态改变时改变其行为，从而让对象看起来像是改变了其类。状态模式的核心思想是将状态封装到独立的类中，每个状态类都定义了在该状态下对象的行为状态模式主要涉…...

编程日记 2025/9/10 22:29:08

二、IDE集成DeepSeek保姆级教学(使用篇)

各位看官老爷好，如果还没有安装DeepSeek请查阅前一篇一、IDE集成DeepSeek保姆级教学(安装篇) 一、DeepSeek在CodeGPT中使用教学 1.1、Edit Code 编辑代码选中代码片段 —> 右键 —> CodeGPT —> Edit Code, 输入自然语言可编辑代码，点击S…...

编程日记 2025/9/14 0:05:27

通义灵码插件安装入门教学 - IDEA（安装篇）

在开发过程中，使用合适的工具和插件可以极大地提高我们的工作效率。今天，我们将详细介绍如何在 IntelliJ IDEA 中安装并配置通义灵码插件，这是一款旨在提升开发者效率的实用工具。无论你是新手还是有经验的开发者，本文都将为你提供…...

编程日记 2025/9/14 19:27:43

每天一个Flutter开发小项目 (4) : 构建收藏地点应用 - 深入Flutter状态管理

引言欢迎回到每天一个Flutter开发小项目系列博客！在前三篇博客中，我们从零开始构建了计数器应用、待办事项列表应用，以及简易天气应用。您不仅掌握了 Flutter 的基础组件和布局，还学习了网络请求、JSON 解析等实用技能，更重要的是，我们一起探讨了高效的 Flutter 学习…...

编程日记 2025/9/14 19:34:22

qt-C++笔记之QtCreator新建项目即Create Project所提供模板的逐个尝试

qt-C笔记之QtCreator新建项目即Create Project所提供模板的逐个尝试 code review! 文章目录 qt-C笔记之QtCreator新建项目即Create Project所提供模板的逐个尝试1.Application(Qt):Qt Widgets Application1.1.qmake版本1.2.cmake版本 2.Application(Qt):Qt Console Applicati…...

编程日记 2025/9/14 19:27:44

【NestJS系列】安装官方nestjs CLI 工具

环境搭建指南：从零开始创建 NestJS 项目一、工具准备 1. 安装 Node.js 环境推荐使用 LTS 版本（目前 20.x 以上）验证安装：终端执行 node -v 和 npm -vNode.js 官网下载2. 包管理器选择这里选用更高效的 pnpm，你也可选择 npm 或 yarn # 安装 pnpm npm install -g pnp…...

编程日记 2025/9/14 19:28:18

【Springboot知识】Logback从1.2.x升级到1.3.x需要注意哪些点？

文章目录 **1. 确认依赖版本**示例依赖配置（Maven）： **2. 处理 StaticLoggerBinder 的移除**解决方案： **3. 修改日志配置文件**示例 logback.xml 配置： **4. 检查兼容性问题**Spring Boot 2.x 的兼容性解决方案&#…...

编程日记 2025/9/14 12:48:34

【Linux C | 时间】localtime 的介绍、死机、死锁问题以及 localtime_r 函数的时区问题

😁博客主页😁：🚀https://blog.csdn.net/wkd_007🚀 🤑博客内容🤑：🍭嵌入式开发、Linux、C语言、C、数据结构、音视频🍭 🤣本文内容🤣&a…...

编程日记 2025/9/8 18:32:59

每日一题——LRU缓存机制的C语言实现详解

LRU缓存机制的C语言实现详解参考1. 数据结构设计双向链表节点哈希表节点哈希表LRU缓存结构 2. 初始化哈希表和双向链表哈希函数初始化哈希表初始化双向链表创建LRU缓存 3. 更新双向链表4. 实现Get操作5. 实现Put操作更新节点值删除最久未使用节点插入或更新节点 6. 释放缓存释…...

编程日记 2025/9/14 13:25:19

虚函数表和虚函数表指针

1.虚函数表什么时候生成？ 编译器编译的时候生成 2.虚函数表存放在哪里？ 讨论两种情况：在磁盘（可执行程序）、在内存（运行状态） 3.虚函数表与虚函数表指针的关系每个类只有一个虚函数&#x…...

编程日记 2025/9/14 17:11:48

计算机毕业设计SpringBoot+Vue.js图书进销存管理系统(源码+文档+PPT+讲解)

温馨提示：文末有 CSDN 平台官方提供的学长联系方式的名片！ 温馨提示：文末有 CSDN 平台官方提供的学长联系方式的名片！ 温馨提示：文末有 CSDN 平台官方提供的学长联系方式的名片！ 作者简介：Java领…...

编程日记 2025/9/14 15:28:18

3-2 WPS JS宏工作簿的打开与保存(模板批量另存为工作)学习笔记

************************************************************************************************************** 点击进入 -我要自学网-国内领先的专业视频教程学习网站 *******************************************************************************************…...

编程日记 2025/9/8 16:05:09

大白话Vuex 核心概念（state、mutations、actions）的使用案例与原理

大白话Vuex 核心概念（state、mutations、actions）的使用案例与原理 Vuex是Vue.js应用程序中专门用来管理状态的工具，就好像是一个大管家，帮你把项目里一些重要的数据和操作管理得井井有条。下面用大白话结合案例来介绍Vuex核心概…...

编程日记 2025/9/8 10:00:11

【学写LibreCAD】1 LibreCAD主程序

一、源码头文件： #ifndef MAIN_H #define MAIN_H#include<QStringList>#define STR(x) #x #define XSTR(x) STR(x)/*** brief handleArgs* param argc cli argument counter from main()* param argv cli arguments from main()* param argClean a list…...

编程日记 2025/9/11 11:16:09

CentOS7最小化安装中使用curl安装yum和wget

在 CentOS 7 最小化安装中，如果已经有curl工具，可以按照以下步骤使用它来安装yum和wget： 1. 备份原有的 yum 源配置文件为了避免配置冲突或后续需要恢复，先备份原有的yum源配置文件。 mv /etc/yum.repos.d/CentOS-Base.repo /…...

编程日记 2025/9/10 6:22:33

【Linux】learning notes（3）make、copy、move、remove

文章目录 1、mkdir （make directory）2、rmdir （remove directory）3、rm（remove）4、>5、touch 新建文件6、mv（move）7、cp（copy） 1、mkdir （make…...

编程日记 2025/9/14 10:09:48

P10108 [GESP202312 六级] 闯关游戏

题目大意如题分析设最佳通关方案为 { s 1 , s 2 , . . . , s k } \{s_1,s_2,...,s_k\} {s1,s2,...,sk}，其中 s i s_i si 代表第 i i i 次到达的关卡（ ≥ N \ge N ≥N 的不算）。当 a k N − 1 a_kN-1 akN−1 时&#…...

编程日记 2025/9/8 13:16:25

Dubbo RPC 原理

一、Dubbo 简介 Apache Dubbo 是一款高性能、轻量级的开源 RPC 框架，支持服务治理、协议扩展、负载均衡、容错机制等核心功能，广泛应用于微服务架构。其核心目标是解决分布式服务之间的高效通信与服务治理问题。二、Dubbo 架构设计 1. 核心组件 Prov…...

编程日记 2025/9/8 18:43:29

网络安全机器学习算法计算机网络安全机制

（一）网络操作系统安全网络操作系统安全是整个网络系统安全的基础。操作系统安全机制主要包括访问控制和隔离控制。访问控制系统一般包括主体、客体和安全访问政策访问控制类型： 自主访问控制强制访问控制访问控制措施： 入…...

编程日记 2025/9/8 12:26:26

【Jenkins】一种灵活定义多个执行label节点的jenkinsfile写法

确定执行机器和自定义工作目录（忽略节点的workspace） pipeline{agent {node {label "XXXXX"customWorkspace "E:/workspace/"}}parameters {}options {}stages {}post {} }仅确定执行机器 pipeline{agent { label "XXXXX&quo…...

编程日记 2025/9/13 16:23:57

Web自动化之Selenium控制已经打开的浏览器(Chrome,Edge)

在使用selenium进行web自动化或爬虫的时候,经常会面临登录的情况,对于这种情况,我们可以利用Selenium控制已经打开的浏览器，从而避免每次都需要重新打开浏览器并进行登录的繁琐步骤。目录说明启动浏览器注意 --user-data-dir说明代码设定代码改进代…...

编程日记 2025/9/10 0:14:01

【万字长文】开源之播对话白鲸开源CEO郭炜--乐观主义的开源精神走得更远

本文为白鲸开源科技CEO郭炜1小时深度访谈全记录来源于：开源之播」Episode15:对话郭炜–乐观主义的开源精神走得更远大家好，我是郭炜，开源圈的“郭大侠”。作为 Apache 基金会的成员，我曾参与并孵化了多个开源项目，如…...

编程日记 2025/9/13 13:00:52

Verilog 位运算符和逻辑运算符的使用

Verilog 位运算符和逻辑运算符的使用目录前言一、逻辑运算符二、位运算符总结前言本文详细描述了Verilog 逻辑运算符和位运算符的使用，随着编程的熟练，有时候总是喜欢混用它们，虽然能实现同样的功能，但最好还是注意一下…...

编程日记 2025/9/11 14:26:57

压测报告：DeepSeek-R1-Distill-Qwen-32B模型性能评估

1. 实验背景本实验旨在评估DeepSeek-R1-Distill-Qwen-32B模型在特定硬件配置下的性能表现。测试硬件为GPU服务器。实验主要关注模型在不同并发请求数下的峰值生成速度。吞吐量（Throughput）：测试模型在单位时间内可以处理多少请求，通常以“每秒生成的令牌数（tokens/s）…...

编程日记 2025/9/14 13:32:31

【论文笔记】ClipSAM: CLIP and SAM collaboration for zero-shot anomaly segmentation

原文链接摘要近年来，CLIP 和 SAM 等基础模型在零样本异常分割 (ZSAS) 任务中展现出良好的性能。然而，无论是基于 CLIP 还是基于 SAM 的 ZSAS 方法，仍然存在不可忽视的关键缺陷：1) CLIP 主要关注不同输入之间的全局特征对齐&am…...

编程日记 2025/9/11 19:05:41

DeepSeek：面向效率与垂直领域的下一代大语言模型技术解析

本文将深入剖析DeepSeek模型的核心算法架构，揭示其在神经网络技术上的突破性创新，并与主流大模型进行全方位技术对比。文章涵盖模型设计理念、训练范式优化、应用场景差异等关键维度，为读者呈现大语言模型领域的最新发展图景。一、DeepSeek…...

编程日记 2025/9/11 8:46:36

win32汇编环境,加速键的应用示例

;运行效果 ;win32汇编环境,加速键的应用示例 ;加速键，就是按某个键，开启某个功能。不用鼠标点来点去的东西。 ;直接抄进RadAsm可编译运行。重要部分加备注。 ;下面为asm文件 ;>>>>>>>>>>>>>>>>>>…...

编程日记 2025/9/11 17:14:26

【计算机网络】OSI模型、TCP/IP模型、路由器、集线器、交换机

一、计算机网络分层结构计算机网络分层结构指将计算机网络的功能划分为多个层次，每个层次都有其特定的功能和协议，并且层次之间通过接口进行通信。分层设计的优势： 模块化：各层独立发展（如IPv4→IPv6&#xff0c…...

编程日记 2025/9/13 21:39:31

[Web 安全] 反序列化漏洞 - 学习笔记

关注这个专栏的其他相关笔记：[Web 安全] Web 安全攻防 - 学习手册-CSDN博客 0x01：反序列化漏洞 — 漏洞介绍反序列化漏洞是一种常见的安全漏洞，主要出现在应用程序将序列化数据重新转换为对象（即反序列化）的过程中…...

编程日记 2025/9/8 20:28:57

每日一题——字母异位词分组

字母异位词分组 1. 问题描述示例提示 2. 解题思路具体步骤 3. 代码实现4. 代码解析（1）排序法（2）哈希表存储（3）动态内存分配（4）释放内存1. HASH_FIND_STR 的作用2. 宏的定义4. 详细解…...

编程日记 2025/9/8 13:27:15

力扣 807. 保持城市天际线(Java实现)

题目分析给定一个二维数组，行列长度相等，要保持四个方向仍一观察高度不变的情况下，适当添加建筑高度，问最大高度增量和。所谓四个方向高度不变的增量，其实就是arr[i][j]与同i行最大值同j列最大值之间的最小值的差&…...

编程日记 2025/9/14 8:23:07

【视频2 - 4】初识操作系统，Linux，虚拟机

📝前言说明： ●本专栏主要记录本人的基础算法学习以及LeetCode刷题记录，主要跟随B站博主灵茶山的视频进行学习，专栏中的每一篇文章对应B站博主灵茶山的一个视频 ●题目主要为B站视频内涉及的题目以及B站视频中提到的“课后作业”。…...

编程日记 2025/9/13 6:24:09

重启securecmd失败

重启securecmd失败问题描述：KES集群部署工具中，节点管理里新增节点下一步报错无法检查securecmd端口进程情况，安装依赖包后再次下一步提示如下报错： 解决办法： [rootlocalhost cluster]# cd /home/kingbase/cluster…...

编程日记 2025/9/8 16:42:07

python学习四

python运算符与表达式表达式： Python中的表达式是一种计算结果的代码片段。它可以包含变量、运算符、常数和函数调用，用于执行各种数学、逻辑和功能操作算术运算符：比较（关系）运算符：赋值运算符：逻辑运算符：位运算符：成员运算符：身份运算符 <...

编程日记 2025/9/8 12:15:24

LeetCode 236.二叉树的最近公共祖先

题目： 给定一个二叉树, 找到该树中两个指定节点的最近公共祖先。百度百科中最近公共祖先的定义为：“对于有根树 T 的两个节点 p、q，最近公共祖先表示为一个节点 x，满足 x 是 p、q 的祖先且 x 的深度尽可能大（一个节…...

编程日记 2025/9/10 13:17:14

react 中，使用antd layout布局中的sider 做sider的展开和收起功能

一话不多说，先展示效果： 展开时： 收起时： 二、实现代码如下 react 文件 import React, {useState} from react; import {Layout} from antd; import styles from "./index.module.less"; // 这个是样式文件&#…...

编程日记 2025/9/10 18:51:02

2025-02-26 学习记录--C/C++-C语言整数格式说明符

合抱之木，生于毫末；九层之台，起于累土；千里之行，始于足下。💪🏻 C语言整数格式说明符【例如】🎀 ：在 C 语言中，%ld 是 printf 或 scanf 等格式化输入输出函…...

编程日记 2025/9/8 11:57:54

绕过过滤order by

一、常见绕过技术 1、注释符截断利用注释符（如 --、#）截断后续查询，消除过滤逻辑的影响。 ORDER BY 1-- 若原查询为 SELECT * FROM table ORDER BY 用户输入，注入后可能忽略后续过滤逻辑。 2、大小写混淆/编码绕过若过滤是大…...

编程日记 2025/9/10 1:10:44

NLP09-加强1-对比SVM

支持向量机（SVM） （一）导入 SVM 相关库 （二） 修改模型初始化 （三） 比较朴素贝叶斯分类器 SVM分类器支持向量机（SVM） 代码修改基于NLP09-朴素贝叶斯问句…...

编程日记 2025/9/10 19:59:58

STM32——HAL库开发笔记22（定时器3—呼吸灯实验）（参考来源：b站铁头山羊）

本文利用前几节所学知识来实现一个呼吸灯实验：两颗led灯交替呼吸。一、STM32CubeMX配置 step1：配置调试接口 step2：配置定时器定时器1位于APB2总线上，如上图所示。 step3：配置时基单元按照下图配置时钟来源配置…...

编程日记 2025/9/11 17:30:57

Vue3+TypeScript 封装一个好用的防抖节流自定义指令

一、前言：为什么需要防抖节流？ 在前端开发中，高频触发的事件（如滚动、输入、点击等）容易导致性能问题。防抖（debounce） 和节流（throttle） 是两种常用的优化手段&#x…...

编程日记 2025/9/14 8:25:38

2025年中国最新安防行业数字安全现状与未来趋势：内生安全成核心共识，从零基础到精通，收藏这篇就够了！

本次，我将为大家剖析由**安奇信发布的《中国安防行业数字安全建设与发展情况白皮书**》。该报告共_37_页，涵盖了众多重要信息和核心论点。若您希望深入了解，请参阅原报告，获取方法已在文档的最后部分提供。报告核心内容随着数字…...

编程日记 2025/9/10 5:36:58

项目管理的新理念主要有哪些

随着时代的发展和市场需求的变化，项目管理的理念也在不断地创新和演变。项目管理的新理念包括敏捷管理、精益管理、知识管理、变革管理、协作式管理和项目生命周期管理等。这些新理念不仅能够提高项目的管理效率，还能帮助团队在复杂的环境中更好地应对挑…...

编程日记 2025/9/10 14:27:31

Spring如何解决循环依赖？

一、Spring的三级缓存关键就是提前暴露未完全创建完毕的Bean。三级缓存来解决循环依赖： 一级缓存：用于存储完全初始化完成的单例Bean。二级缓存：用于存储尚未完全初始化，但已实例化的Bean，用于提前暴露对象&#x…...

编程日记 2025/9/8 18:55:29

vscode java环境中文乱码的问题

先说我的结论： 由于我的系统是windows的，所以vscode使用的是默认gbk的编码进行的。但是我的目的是全部都使用utf-8，因为我的程序始终是要去linux上去运行的，总不能在本地是好的，然后到服务器上就不行了吧，…...

编程日记 2025/9/8 19:10:01