- 博客(34)
- 收藏
- 关注
RSS订阅原创 Vue3 + Vite + MapboxGL 实战：集成 SuperMap iServer 加载 CGCS2000 地图服务与自定义标记
本文介绍了在Vite+Vue3+TypeScript项目中集成MapboxGL v1加载SuperMap REST地图服务的方案。重点包括：通过script标签引入SuperMap增强版MapboxGL以支持CGCS2000坐标系；初始化地图时配置crs参数为EPSG:4490；动态叠加业务图层的方法；以及使用自定义DOM元素实现Marker标记。文章还总结了开发中的常见问题，如坐标系设置、样式加载、地图初始化时机等注意事项，为国产化GIS项目开发提供了实用参考。
2025-12-31 10:27:28
1074
原创 Vite搭建一个Vue 3 + TypeScript项目，并汇总关键的配置要点。保姆级教程！
摘要：本文介绍了使用Vite搭建Vue3项目的基础配置流程。主要内容包括：1) 环境准备(Node.js 12+)；2) 使用Vite初始化项目并安装SCSS支持；3) 配置Element Plus组件库及国际化；4) 设置Vue Router路由；5) 配置自动导入功能和@别名；6) 引入SVG图标插件。文中详细说明了各步骤的安装命令和配置方法，涵盖了样式初始化、路由守卫、TS类型支持等关键环节，为快速搭建Vue3项目提供了完整解决方案。
2025-12-24 14:48:50
610
原创 Vue3+TypeScript项目中配置自动导入功能，遇到了问题需要详细的配置教程！
Vue3+TypeScript项目中使用unplugin-auto-import和unplugin-vue-components实现自动导入的完整配置流程。实现完整的自动导入功能，大幅提升开发体验。
2025-11-08 12:59:00
535
原创 前端开发3年面试题悉数总结，面试后一定要总结复盘！（持续更新中）
前端面试场景题核心要点 当前面试趋势：前端面试已从"八股文"转向场景题，更注重项目经验和系统思维能力。以下是核心知识体系： 核心技术领域 HTML5新特性：语义化标签、Canvas/SVG、本地存储、WebSocket等 CSS核心：Flex/Grid布局、响应式适配、BFC机制、垂直居中方案 JavaScript重点：闭包/原型链、异步方案、设计模式、性能优化手段 Vue深度：响应式原理、组件通信、性能优化、权限控制方案 工程化实践：Webpack/Vite区别、性能优化策略、监控方案
2025-10-14 00:21:06
1335
原创 使用 Node、Express 和 MongoDB 构建一个项目工程
本文介绍了使用Node.js+Express+MongoDB构建RESTful API的全过程。主要内容包括：1) 项目初始化与Express服务器搭建，包括环境准备、依赖安装和项目结构；2) MongoDB数据库连接配置，涵盖安装、可视化工具使用和Node.js连接方法；3) 后端MVC架构设计；4) 身份验证实现，使用JWT生成token并进行服务端验证。文章提供了详细的代码示例和配置说明，从环境搭建到核心功能实现，为开发者构建安全可靠的Node.js后端服务提供了完整指导。
2025-04-24 17:17:07
1756
1
原创 关于YOLO模型，实现视频识别！
YOLOv11是一款基于深度学习的先进计算机视觉工具，在速度和精度方面表现卓越。本文详细介绍了YOLO的安装配置流程，包括：1)克隆代码库；2)安装依赖环境；3)配置CUDA和cuDNN；4)环境激活；5)GPU验证；6)YOLO功能测试。最后提供了一个AI视觉识别的完整Demo代码，展示了如何使用YOLOv8进行视频目标检测和跟踪，包括轨迹绘制等功能。该教程适用于不同水平的开发者，帮助快速实现计算机视觉项目。
2025-04-09 11:05:11
1484
4
原创 ngrok内网穿透，亲测有效，小白教程！
摘要 ngrok是一个全球分布式反向代理工具，能够实现内网穿透，让外部网络访问本地运行的应用和服务。使用步骤包括：下载对应系统的ngrok客户端，解压运行后配置密钥验证，启动本地项目后通过ngrok映射指定端口（如9528），最后将生成的公网地址分享即可实现远程访问。整个过程简单快捷，解决了内网服务对外暴露的问题。
2025-02-21 14:47:12
523
原创 关于Three.js控制器，飞行控制器（FlyControls），轨道控制器（OrbitControls）, 第一人称控制器（FirstPersonControls）
# Three.js中实现人称视角切换需要了解以下控制器，FlyControls，OrbitControls和FirstPersonControls，具体这三个控制器的应用场景及优缺点会在下方内容介绍。
2024-12-25 16:59:14
1489
原创 AE创作大屏可视化组件光效-小白一教就会-教程
摘要：本文详细介绍了在AE软件中制作光标特效的12个步骤。从导入素材、调整比例开始，逐步讲解如何用钢笔工具添加光效轨迹、调整不透明度、设置修剪路径参数。重点说明了如何通过设置路径百分比和偏移帧来控制光效长度和移动效果，并介绍了描边锥度设置、预合成等关键步骤。最后提到需要安装PAGViewer插件才能完成导出，最终可生成APNG格式的动态光标效果。整个过程涵盖了从素材处理到最终导出的完整流程。
2024-12-12 11:01:26
1052
原创 前端学习Java第一篇：安装JDK，环境变量，JDK的使用
JDK是Java开发的必备工具包，包含编译器、运行环境等核心组件。安装时建议下载到D盘而非C盘，主要目录包括bin(工具命令)、conf(配置文件)等。配置环境变量需设置JAVA_HOME和Path路径。使用步骤：1)用记事本编写HelloWorld.java；2)通过javac编译生成.class文件；3)用java命令运行程序(不加.class后缀)。这是Java开发的入门基础。
2024-11-12 11:01:39
563
1
原创 关于uni-app H5项目使用海康视频H5播放器组件，避坑教程
摘要：本文介绍了在uni-app项目中集成海康威视H5播放器组件的详细步骤。主要内容包括：1) 注意Node.js版本要求（18版本）；2) 下载并导入插件和H5播放器开发包；3) 配置template.html文件；4) 修改manifest.json源码视图；5) 在页面中使用lq-hkvideo组件实现视频预览、分屏布局和全屏功能。文中提供了完整的代码示例，包括视频播放器初始化、分屏控制按钮以及相关事件处理方法的实现。
2024-09-02 17:42:08
1680
原创 uni-app关于顶部导航添加icon图标并绑定事件！小白教程！
本文介绍了在uni-app中使用uni-icons图标的步骤：1）下载并导入uni-icons插件；2）将字体文件移动到项目static/fonts目录；3）在pages.json中配置按钮样式，需注意图标名称需从官方文档查询；4）在页面methods中绑定按钮点击事件onNavigationBarButtonTap。整个过程实现了在导航栏添加自定义图标按钮的功能。
2024-08-21 09:53:38
1230
1
原创 关于前端打包部署docker运行项目
本文介绍了使用Docker部署应用的五个步骤：1)安装Docker；2)创建项目文件夹；3)使用docker-compose up -d命令后台启动容器；4)替换前端dist文件；5)通过docker ps查看运行状态，最后在浏览器访问127.0.0.1:8899。文章简要说明了docker-compose的功能和docker ps命令的用途。
2024-07-09 15:57:32
402
原创 解决npm i 命令，导致此应用无法在你的电脑上运行
摘要：解决nvm下载Node.js不完整问题的方法：1)删除nvm中不完整的Node.js；2)从官网下载对应版本的zip压缩包；3)解压后重命名保留版本号；4)将文件放入nvm包文件夹。该方法可修复因nvm下载不完整导致的Node.js安装问题。
2024-06-24 15:57:20
803
原创 基于Win11系统使用Hyper-v安装Win7虚拟机，关于Hyper-v网络设置及常见问题解决！
本文详细介绍了在Windows系统上使用Hyper-V安装Win7虚拟机的完整步骤。主要内容包括：1）启用Hyper-V功能并创建虚拟机；2）配置虚拟机参数（内存、硬盘、网络等）；3）安装系统镜像及驱动；4）解决常见网络连接问题，包括添加虚拟交换机、共享网络连接、调整网络适配器优先级等。文章提供了Win7镜像和集成服务的下载链接，并针对不同网络问题给出了具体的解决方案，帮助用户顺利完成虚拟机安装并确保网络连接正常。
2024-06-18 16:46:05
12264
原创 在vue3中根据Element Plus组件开发右键菜单，组件复用性高，可设置自定义图标和icon！
在vue3中根据Element Plus组件开发右键菜单，组件复用性高，可设置自定义图标和icon！
2024-06-16 15:51:15
1491
原创 关于css样式让图片的某些区域拉伸，其他部分保持比例！原理讲解！
本文介绍了CSS中控制图片边框拉伸效果的方法。通过border-image-source加载背景图片，使用border-image-slice设置切片大小（上80px、右30px、下70px、左30px），并用fill填充中间部分。border-image-repeat设置为stretch实现图像拉伸，配合border-width和border-style定义边框样式。最后设置固定高度（550px）防止图片变形，通过绝对定位添加标题文本。完整代码实现了带自定义边框和标题的内容区块效果。
2024-06-06 11:24:57
4934
1
原创 vscode查询项目总代码行数
摘要：在VSCode中统计项目代码行数可通过VSCodeCounter插件实现。具体步骤为：1)安装并重启VSCode；2)打开插件页面；3)使用快捷键Ctrl+Shift+P输入"VscodeCounter:Count lines in directory"命令；4)系统将显示项目代码总行数统计结果。该方法简单高效，适用于快速获取项目规模统计需求。（99字）
2024-05-30 10:36:10
2547
原创 vue2使用audios，实现音频播放
本文介绍了在Vue项目中实现音频播放功能的方法：1.在模板中添加audios标签并绑定音频路径；2.在return中引入音频文件；3.在触发事件中直接调用play()方法播放。注意事项包括：确保音频后缀为小写.mp3、保持触发节点一致、避免单独封装播放函数。该方法通过$refs直接调用音频播放，简洁高效。
2024-05-17 14:19:23
829
原创 设置VUE项目，HTML标签不换行设置
摘要：本文介绍了在VSCode中配置Vetur插件实现HTML/TS/JS代码格式化。主要步骤包括：1)通过设置搜索"vetur.format.defaultFormatter.html"；2)选择js-beautify-html格式化器；3)配置JSON文件设置自动换行等参数。还提供了TS/JS代码不换行的配置方法，包括设置单引号、属性换行等选项。配置完成后可让代码保持在一行显示。
2024-04-30 11:19:28
1415
原创 vue2滚动条el-scrollbar使用，滚动条移动和重置位置
本文介绍了Element UI组件中滚动条的实现与封装方法。首先展示了使用el-scrollbar和el-steps组件创建垂直步骤条的代码结构，通过设置wrap-style属性控制横向溢出隐藏。其次封装了两个滚动条操作方法：1) scrollToActiveStep实现逐步滚动功能，计算目标位置和最大可滚动距离；2) scrollToTop将滚动条重置到顶部。方法中通过$refs获取滚动容器实例，利用scrollTop属性控制滚动位置，实现了平滑滚动和归位功能。
2024-04-07 10:47:35
2790
1
原创 vue2使用v-contextmenu右键菜单组件，小白教程
本文介绍了如何在Vue项目中实现右键菜单功能。首先通过npm安装v-contextmenu插件并全局引入，然后封装了一个包含多级菜单的右键组件。该组件支持全屏切换、剖面视图、仿真模型视角和数字仿真等功能，通过插槽方式在其他组件中使用。菜单样式可自定义，包括滚动条、复选框和单选框等交互元素的设计。使用时只需将需要右键功能的DOM元素包裹在RightClickMenu组件内即可。文章提供了完整的安装配置、组件封装和使用示例，实现了灵活可定制的右键菜单解决方案。
2024-04-07 09:16:33
1965
原创 关于uni-app中使用vant组件文件上传功能改造，套用uni-app文件上传组件
本文介绍了在uni-app中解决vant组件文件上传问题的方案。通过替换为uni-file-picker组件实现文件上传功能，详细展示了表单的完整代码结构，包含车牌号、车辆颜色等字段。重点说明了文件上传的实现方法：定义fileLists数组存储临时文件，使用@select事件触发上传，调用uni.uploadFile官方API完成文件传输，并在成功回调中处理返回数据。文章还指出该组件可在uni-app官网的扩展组件中找到，为开发者提供了完整的文件上传解决方案。
2023-11-30 14:32:21
939
原创 vue3前端解析xml格式文件为js对象数据，最终解析成Tree数据结构。实现Tree数据增删改节点，然后导出xml格式数据！
本文介绍了在Vue项目中实现XML文件导入、解析、编辑和导出的完整流程。首先通过文件输入框选择XML文件，使用xml-js库将XML转换为JSON对象，再转换为Tree数据结构便于前端操作。核心方法包括：1)使用FileReader读取XML文件；2)通过convert.xml2json解析为JSON；3)自定义convertToTree方法将JSON转换为树形结构；4)实现节点增删改后，使用convertToXmlData方法将树结构转回XML格式；5)最终通过convert.js2xml生成XML字符串
2023-10-12 15:00:29
4305
3
原创 vue3项目使用高德地图-保姆级教程
本文介绍了在Vue3项目中集成高德地图JSAPI的完整流程。首先需要在高德开放平台注册账号并申请Key和安全密钥，然后通过npm安装@amap/amap-jsapi-loader。在代码中需配置安全密钥和开发者Key，使用AMapLoader.load方法加载地图，并可在容器div中展示。文章还演示了如何切换卫星图和路网图等不同图层，通过实例化TileLayer对象并传入Map构造函数实现。整个过程包括账号申请、SDK集成、地图初始化和图层控制等关键步骤。
2023-09-27 17:47:07
1566
原创 MAC通过git命令首次上传项目到新仓库中
摘要：本文介绍了将本地代码推送到新建空远程仓库的步骤：1）本地项目初始化；2）添加远程仓库地址；3）添加文件到暂存区；4）提交本地仓库；5）推送至远程主分支（main/master）。注意根据远程仓库默认分支选择相应命令。
2023-09-26 15:25:10
302
原创 vue3+element-plus实现Tree树控件可增删改查
本文介绍了如何扩展Element Plus树形组件实现节点编辑功能。通过自定义renderContent方法，在节点右侧添加操作按钮（添加、编辑、删除）。其中编辑功能使用ElMessageBox弹窗实现，用户输入新值后更新节点label。代码示例包含完整的树形数据结构定义和三个核心操作方法：append添加子节点、remove删除节点、edit编辑节点标签。实现的关键点在于自定义节点渲染逻辑，通过h函数创建包含操作按钮的DOM结构，并设置合理的样式布局使按钮与节点标签并排显示。
2023-09-18 17:41:29
3335
2
原创 vue3+node.js实现图片上传和文件上传+保存文件到node.js后端
vue3+node.js实现图片上传和文件上传+保存文件到node.js后端
2023-09-13 18:54:34
2166
原创 vue3项目搭建详细流程
本文介绍了使用Yarn和Vite快速搭建Vue项目的步骤：首先在目标目录下运行yarn create vite命令，然后设置项目名称（建议使用中划线而非下划线），接着选择Vue框架和JavaScript语言，最后执行三个初始化命令完成项目搭建。整个过程简洁高效，最终会生成一个可运行的Vue项目基础结构。
2023-09-07 15:06:08
239
原创 vue3组件中使用Echarts小白教程
6.将官网组件的数据复制下来，用响应式ref保存，并写echarts初始化函数。1.打开Echarts官网，去寻找你需要的实例组件，应有尽有！7.最后一步就是生命周期函数中，调用echarts初始化函数。3. 在你需要的组件中引入ECharts。4. 官网找到你想要组件，并找到完整代码。5.在组件中HTML标签上添加id属性。2.在vue3项目中下载依赖库。
2023-08-31 15:27:02
638
原创 vue3中导航栏功能实现和路由跳转
本文介绍了在Vue3中实现导航栏图片切换和路由跳转的方法。首先在head组件中通过v-for循环渲染导航栏图片，使用三目运算符根据当前选中状态显示激活或未激活图片。然后通过import引入本地图片资源并存储在数组中。点击事件NavigationBarChanges会更新当前选中索引，同时利用vue-router跳转到对应路由路径。最后在home组件中添加二级路由出口实现页面切换。整个实现过程简洁高效，结合了状态管理和路由控制。
2023-08-31 11:16:15
1857
原创 pkg打包node.js全流程及解决pkg打包慢
本文介绍了将前端+Node.js项目打包成exe执行文件的详细流程：1) 前端项目通过npm run build生成dist文件夹并放入Node.js项目的public目录；2) 安装pkg打包工具并配置package.json文件；3) 重点解决了pkg下载node二进制文件缓慢的问题，包括手动下载对应版本文件并放入缓存目录的方法；4) 最后执行pkg命令完成打包。文中特别强调了版本匹配和缓存文件放置的注意事项，并指出下载不同系统的二进制文件可生成对应系统的可执行文件。
2023-08-28 10:54:00
7853
1
原创 关于安装mongodb过程中出现Service MongoDB Server (MongoDB)‘ (MongoD8) failedto start, Verify that you have suf
摘要：安装MongoDB时若出现安装失败，可能是缺少Visual C++ Redistributable依赖包。解决方法是先下载并安装Visual C++ Redistributable 2019（下载链接提供），再重新安装MongoDB即可成功。具体安装步骤可参考相关博客教程。
2023-08-27 13:59:09
599
空空如也
空空如也
TA创建的收藏夹 TA关注的收藏夹
TA关注的人