- 博客(145)
- 收藏
- 关注
RSS订阅原创 Vite 缩短打包时间的实用指令与配置策略
中大型项目通常可获得 40%-70% 的构建速度提升。建议通过 --profile 参数生成的火焰图针对性优化耗时最长的模块。
2025-04-02 14:20:26
409
原创 电脑上使用阿里的 Qwen模型
安装 Python：确保已安装 Python 3.8 或以上版本。若未安装或版本不符，请从 python.org 下载并安装，记得添加到 PATH。由于 adapters 文件夹中包含了训练的参数文件，因此不需要额外指定 --model。GPU 加速（如需）：若您计划利用 GPU 加速，需安装适配您 CUDA 版本的 PyTorch。创建虚拟环境（推荐）：为避免依赖冲突，建议创建虚拟环境。注意：如果需要 Hugging Face 认证，请提供你的凭证或设置认证令牌。使用 Qwen 模型。
2025-04-02 14:17:46
297
原创 前端使用 Broadcast Channel API 实现跨浏览器标签页通信
通道名称 所有通信页面需要使用相同的通道名称 (new BroadcastChannel(‘name’))生命周期 需要手动关闭 (channel.close()) 避免内存泄漏。Broadcast Channel 专用API、高效 兼容性要求较高。localStorage 事件 兼容性好 需要处理存储、仅字符串。同源限制 只能在相同协议、域名、端口的页面间通信。避免重复操作（如只允许一个标签页播放音乐）多标签页状态同步（如登录状态）跨标签页通知（如后台任务完成）二、进阶用法（带消息类型）
2025-03-07 10:17:02
174
原创 Cytosacpe.js中使用了cytoscape-sbgn-stylesheet插件自定义节点图片资源展示
确保节点数据正确确保节点的 bgImage 属性被正确赋值为有效的 SVG URL：javascript...item,bgImage: item.svgUrl || '', // 确保此处能获取到有效的 SVG URL// ...}));调整样式优先级在 sbgnStyles 中，确保背景图样式有足够高的优先级。修改后的样式规则如下：javascriptsbgnStyles.push({ // 将背景图样式放到数组末尾以确保优先级。
2025-03-07 10:16:19
478
原创 Webpack 的 require.context 和 Vite 的 import.meta.glob 的详细介绍和使用
require.context 和 import.meta.glob 都支持路径匹配模式，但 import.meta.glob 更加灵活，支持多种匹配模式。import.meta.glob 默认是懒加载，而 require.context 会在构建时将所有匹配的模块打包在一起。如果需要立即加载所有模块，可以使用 import.meta.glob 的 eager: true 选项。通过以上方法，你可以在前端项目中动态加载组件，从而实现更灵活的模块管理和优化。
2025-02-20 08:58:40
612
原创 LogicFlow 在 React/Vue 中的完整安装使用指南
以下是 LogicFlow 在 React/Vue 中的完整安装使用指南，包含 核心配置 与 实战示例：一、基础安装。
2025-02-17 08:51:07
641
原创 Three.js 中，将节点用 SVG 图片展示
如果你的项目是基于 Vue 的，你可能需要确保 SVG 图片存放在 public 文件夹中，并通过 /image.svg 的方式访问。加载 SVG 图片为纹理：使用 THREE.TextureLoader 将 SVG 图像加载为纹理。示例路径：‘path/to/your/image.svg’，需替换为实际路径。通过上述修改，节点将以 SVG 图片展示，并且动态连线的逻辑依然保持不变。设置平面的透明性和尺寸：确保透明部分正常显示，并根据需要调整平面尺寸。使用平面几何体代替球体几何体，用于展示 SVG 图片。
2025-02-14 09:03:11
396
原创 HTMX 的介绍和使用
HTMX 的核心思想是利用现有的 HTML 和 HTTP 协议，减少对 JavaScript 的依赖。HTMX 的最大应用场景是 简化现代 Web 应用的开发，尤其是在需要动态交互但又不希望过度依赖复杂 JavaScript 框架（如 React、Vue 或 Angular）的情况下。它的核心优势在于通过简单的 HTML 属性实现复杂功能，减少对 JavaScript 的依赖，同时保持轻量和高性能。如果你正在寻找一种更简单、更轻量的方式来构建动态 Web 应用，HTMX 是一个非常值得尝试的工具。
2025-02-14 09:02:10
892
原创 Macos下载 unity 的步骤与使用方法
点击 “Download Assistant” 链接，下载适用于 macOS 的 .dmg 文件。安装完成后，你可以在 “/Applications/Unity” 文件夹中找到 Unity 图标。双击 Unity 图标启动 Unity Hub（如果已安装）或 Unity Editor。在下载页面中，找到 “Download Assistant” 部分。在下载页面中，找到 “Manual installs” 部分。项目视图 (Project View)：管理项目中的资源文件。下载和安装 Unity。
2025-02-13 08:57:38
834
原创 DeepSeek 接入 Unity
创建 HTTP 请求：使用 Unity 的 UnityWebRequest 类创建 HTTP 请求，调用 DeepSeek 的 API。DeepSeek 可以接入 Unity 并帮助开发。如果你需要更灵活的控制，可以手动集成 DeepSeek API 到 Unity 项目中。异步处理：使用 async 和 await 确保在等待 API 响应时不会阻塞主线程。处理响应：解析 API 返回的 JSON 数据，处理响应内容。
2025-02-13 08:56:54
3120
2
原创 DeepSeek 的 API 服务引入 WPS Office
以下是将 DeepSeek 的 API 服务引入 WPS Office 的通用集成教程。通过以上方法，你可以将 DeepSeek 的功能无缝集成到 WPS Office 中，提升办公自动化效率。确保使用 WPS Office 最新版（支持 VBA 或 Python 插件开发）。API 调用频率：注意 DeepSeek 的 API 调用限制。若未安装 VBA 支持，需下载 WPS VBA 模块。保存为 .py 文件，双击运行或通过 WPS 宏调用。智能校对：调用 API 检查文档语法错误。
2025-02-12 09:01:08
4636
原创 DeepSeek 引入到微信并实现动态获取信息发给自己
当微信发送 POST 请求处理用户消息时，会解析用户消息，调用 DeepSeek API 获取回复，并将回复以 XML 格式返回给微信。异步处理：微信服务器有 5 秒超时限制，若 DeepSeek 响应慢，可先返回空响应（状态码 200），然后使用客服消息接口异步推送结果（需用户 48 小时内互动）。注册微信公众号：选择类型为服务号（具备更多 API 权限）或订阅号，并完成微信认证（部分接口需认证后使用）。日志与监控：记录用户请求和 API 响应，监控服务稳定性（如使用 Uptime Robot）。
2025-02-12 08:59:10
746
原创 Svelte前端框架
Svelte 简介Svelte 是一个现代的前端框架，用于构建高效、响应式的用户界面。与 React、Vue 和 Angular 等传统框架不同，Svelte 在构建时将组件编译为高效的纯 JavaScript 代码，而不是在浏览器中运行一个庞大的运行时库。这使得 Svelte 应用具有更小的体积和更高的性能。Svelte 的核心特点无虚拟 DOM：Svelte 直接在构建时编译组件为原生 JavaScript 代码，避免了虚拟 DOM 的开销。更新 DOM 时更加高效。
2025-02-11 09:22:30
1151
原创 Cursor 编辑器详细介绍与使用
Cursor 是一款 AI 驱动的代码编辑器，集成了先进的大型语言模型（如 GPT-4、Claude 3.5），旨在提升开发者的编程效率和代码质量。代码库问答：使用 @Codebase 或 Ctrl+Enter 询问关于代码库的问题，Cursor 会搜索代码库找到相关代码来回答。使用 @Codebase 或 Ctrl+Enter 询问关于代码库的问题，Cursor 会搜索代码库找到相关代码来回答。点击聊天代码块顶部的播放按钮，将代码建议直接应用到代码库中。
2025-02-11 09:21:37
805
原创 DeepSeek引入到Cursor和VSCode编辑器指南
设置 API 接入点，输入 DeepSeek 的 API 地址：https://api.deepseek.com。访问官网：打开浏览器，进入 Cursor 官方网站：https://www.cursor.com/。注册 ModelBox 账号：访问 DeepSeek 官网注册账号，链接如下：DeepSeek官网。注册 DMXAPI 账号：访问 DMXAPI 官网注册账号，链接如下：DMXAPI官网。获取 API Key：注册完成后，创建一个 API Key，并妥善保管。
2025-02-10 16:11:24
2168
原创 DeepSeek 的详细介绍与使用，和本地部署的介绍
深度求索（DeepSeek）是中国一家专注于通用人工智能（AGI）研发的科技公司，致力于通过大模型技术实现长文本理解、复杂推理、代码生成等核心能力。混合专家模型（Mixture of Experts），通过动态路由提升推理效率，参数规模覆盖16B至1.8T。如法律咨询（DeepSeek-Law）、医疗问答（DeepSeek-Med），基于垂直领域数据微调。代码生成与理解模型，支持Python、Java等主流语言，集成IDE插件实现智能编程辅助。低成本调用：按Token计费，提供免费额度及企业级定制套餐。
2025-02-10 14:37:48
3259
原创 在 Cytoscape.js 中，要实现节点从不同位置连接连线到另一个节点（例如左侧或右侧的上、中、下）
在 Cytoscape.js 中，要实现节点从不同位置连接连线到另一个节点（例如左侧或右侧的上、中、下），可以通过 定义边的端点（sourceEndpoint 和 targetEndpoint） 来实现。方位组合：left/right/top/bottom + - + top/middle/bottom（例如 left-top, right-middle）通过上述方法，你可以灵活控制连线的起始和结束位置，满足复杂关系图的绘制需求。（示意图：一个节点从右侧的不同位置连接到另一个节点的左侧不同位置）
2025-02-10 08:56:05
361
原创 Expo运行模拟器失败错误解决（xcrun simctl ）
解决 xcrun simctl 错误：确保 Xcode 命令行工具已安装并正确设置路径，必要时更新 Xcode 并重启终端或 Mac。确保 package.json 中的依赖版本与上述更新后的版本一致。如果有冲突，手动更新 package.json 文件中的版本号。如果输出不是 /Applications/Xcode.app/Contents/Developer，重复上述设置路径的步骤。更新 Expo 依赖：运行 npx expo install 命令更新相关依赖，并清除 Metro 缓存。
2025-02-10 08:54:39
683
原创 Cytoscape.js 使用edgehandles 插件，动态创建节点之间的连线
在 Cytoscape.js 中，使用edgehandles 插件，用于通过拖拽交互创建边（连线）。以下是 edgehandles 插件的使用方法和详细说明。通过以上步骤，你可以在 Cytoscape.js 中使用 edgehandles 插件实现拖拽创建连线的功能。在使用 edgehandles 插件之前，需要将其注册到 Cytoscape.js 中。注册插件：使用 cytoscape.use(edgehandles) 注册插件。初始化插件：通过 cy.edgehandles() 启用插件。
2025-01-07 09:06:20
647
原创 Three.js 初始化容器无高度问题解决
如果 this.$refs.threeContainer.clientHeight 返回 0，可能是因为 Vue 组件的 DOM 元素在组件的生命周期中还没有完全渲染，导致 clientHeight 在 initThree 方法调用时为 0。nextTick 会在 DOM 更新之后被执行，可以确保你获取到正确的尺寸。如果容器的大小可能发生变化（例如浏览器窗口调整大小），你需要在窗口大小变化时更新渲染器的尺寸。如果容器尺寸动态变化，可以 监听窗口大小变化，在窗口调整时更新 Three.js 渲染器的尺寸。
2025-01-03 08:55:01
210
原创 Three.js 的安装与使用，节点的展示与动态连线
Three.js 的安装与使用，在vue项目中完成节点的展示与动态连线ChatGPT 说：ChatGPT在 Vue 项目中使用 Three.js 实现节点展示与动态连线，可以通过以下步骤完成。以下内容涵盖安装、Vue 项目集成 Three.js，以及实现节点动态展示和连线的完整流程。
2025-01-03 08:54:18
611
原创 D3.js中，配置连线箭头的方向
在D3.js中，要配置连线箭头的方向，您需要确保箭头标记（marker）被正确地添加到SVG中，并且连线的marker-end属性指向这个标记。默认情况下，如果marker-end属性被设置，箭头会指向连线的终点。如果您发现箭头是双向的，这可能是因为您的箭头标记配置有误或者连线数据的问题。通过以上步骤，您应该能够配置单向箭头的连线。如果问题仍然存在，请检查您的代码，特别是箭头标记的配置和连线数据的设置，确保它们正确无误。确保箭头标记的viewBox和路径正确配置，以便箭头指向正确的方向。
2024-12-27 09:11:08
398
原创 D3.js点击两个节点时动态添加连线
join方法结合了enter、update和exit三个操作，使得您可以同时处理新添加的元素、更新现有元素和移除不再需要的元素。这段代码确保了在点击两个节点时动态添加连线，并且箭头标记正确配置，使得箭头只显示在连线的末端。exit => exit.remove() // 移除多余的元素。确保您的节点数据中包含id属性，并且在添加连线时使用这些id。在您的代码中，link选择集应该在添加连线之前初始化。确保在力模拟的tick事件中更新连线的位置。// 更新力模拟的节点和连线位置。// 初始化SVG和力模拟。
2024-12-27 09:10:18
848
原创 setTimeout 和 setInterval中使用睡眠函数的对比
实际的倒计时间会比预期更长，因为 sleep 的 500ms 阻塞叠加在 setTimeout 的 1000ms 延迟之上。在这段代码中，setInterval 并不一定更准确，因为它同样受阻塞影响（sleep(500) 会导致周期时间延长）。同样由于 sleep 的阻塞，会影响后续的 setInterval 调用，导致实际间隔时间大于 1 秒。要提高倒计时的精度，可以避免使用阻塞代码（如 sleep），并使用更精准的时间计算。通过计算实际经过的时间来动态调整倒计时，避免阻塞操作的影响。
2024-12-26 09:18:57
475
原创 CommonJS 迁移到 Vite
如果你的项目中有很多 CommonJS 代码，手动转换可能会很繁琐。可以考虑使用 Babel 来帮助转换。你可以安装 Babel 并配置它来自动转换 CommonJS 代码为 ESM。
2024-12-26 09:18:29
395
原创 Node.js之 node-opcua 使用
Node-OPCUA 是一个专为 Node.js 和浏览器环境设计的 OPC UA 协议栈，使用 TypeScript 编写，提供了实现 OPC UA 协议的所有必要功能。Node-OPCUA 也可以用来创建 OPC UA 客户端，连接到 OPC UA 服务器并进行数据交换。完整的 OPC UA 协议栈：Node-OPCUA 提供了一个完整的 OPC UA 客户端和服务器端的实现。在这个示例中，我们创建了一个 OPC UA 客户端，并连接到指定的 OPC UA 服务器。创建 OPC UA 服务器。
2024-12-16 09:21:50
652
原创 MacOs使用Wine 安装UaExpert与UaExpert的使用
如果你已经使用 wine 命令安装了 UaExpert，那么你应该已经有一个可执行的 UaExpert 程序在 Wine 的虚拟 C 盘目录下。当你第一次启动 UaExpert 时，程序会提示你创建一个自签名的电子证书，这个证书将用于 OPC UA 的加密通信。如果遇到任何问题，如字体显示不正常、界面渲染问题等，可以尝试更新 Wine 到最新版本，或者查找相关的 Wine 应用数据库（AppDB）条目，看看是否有其他用户遇到并解决了类似的问题。UaExpert 允许用户查看和分析服务器数据的历史趋势。
2024-12-16 09:21:29
1354
原创 前端Webpack配置之eval-source-map
是 Webpack 中devtool选项的一种模式，它提供了一种内联 Source Map 的方式，用于开发环境中的源代码映射。这种模式将 Source Map 以 base64 编码的形式直接内联到每个eval函数中，这意味着每个模块的 Source Map 都包含在模块本身之内，而不是单独的文件。
2024-12-10 09:04:17
617
原创 React Scan(自动检测渲染周期，通过视觉提示突出显示导致性能问题的组件)的介绍和使用方法
React Scan 是一个开源的开发工具，由 Aiden Bai 和 Million Software 创建，旨在帮助开发人员识别和修复 React 应用程序中的性能瓶颈。与传统的性能分析工具不同，React Scan 提供了一个简单的即插即用解决方案，可以通过脚本标签或 npm 包添加，以自动分析渲染性能。
2024-12-10 09:03:48
996
原创 前端代码混淆vite-plugin-bundle-obfuscator 和vite-plugin-obfuscator的区别和优劣
提供可定制的混淆器选项以满足不同需求。
2024-12-05 10:10:23
1139
原创 前端解决loader 解析文件时常过多的问题
通过上述方法，你可以有效地减少Webpack loader解析文件的数量，提高构建性能。每种方法都有其适用场景，你可以根据项目的具体情况选择合适的优化策略。属性，你可以指定loader只处理特定的目录下的文件，这样可以减少不必要的文件解析。生成单独的编译结果，这样可以提高应用程序的编译速度。虽然这会增加构建过程的复杂度，但可以显著提高后续构建的速度。插件来分析各loader和plugin的速度，找出性能瓶颈，并针对性地进行优化。对于性能开销较大的loader，可以使用。对于不经常变化的代码，可以使用。
2024-12-05 10:09:08
788
原创 Vue3.0 使用Pinia
这个示例创建了一个名为useCounterStore的store，其中包含一个名为count的状态，一个计算属性doubleCount，以及两个actions：increment和decrement。在组件中，我们导入并使用这个store，通过调用increment和decrement来更新计数，并通过count和doubleCount显示当前计数和其两倍的值。下面是一个使用Vue 3、Pinia和TypeScript的简单示例，这个示例创建了一个计数器应用。步骤 4: 创建Pinia Store。
2024-11-28 09:37:36
452
原创 React Native的`react-native-reanimated`库中的`useAnimatedStyle`钩子来创建一个动画样式
React Native的库中的钩子来创建一个动画样式，用于一个滑动视图的每个项目（SliderItem钩子允许你根据动画值（在这个例子中是scrollX）来动态地设置组件的样式。
2024-11-20 16:13:01
625
原创 Git命令和操作用于管理代码变更、与远程仓库同步以及处理可能的合并冲突
这些Git命令和操作用于管理代码变更、与远程仓库同步以及处理可能的合并冲突。
2024-11-20 16:12:28
513
原创 webcatalog 的安装与使用
WebCatalog 是一个跨平台的免费程序，允许用户将常用的网页应用转化为桌面应用，以提高工作效率和用户体验。以下是WebCatalog的安装与使用方法：下载WebCatalog：安装FUSE库支持（对于Linux用户）：参考来源：优快云博客创建快捷方式（对于Linux用户）：在文件中添加以下内容：赋予权限并运行：参考来源：优快云博客使用WebCatalog打开WebCatalog应用程序：搜索并转化网页应用：自定义应用程序：启动桌面应用：对于Mac用户来说，安装
2024-11-08 11:58:04
1559
原创 React Native 项目使用Expo模拟器运行iOS和Android
如果你使用的是 Genymotion 模拟器，确保它已经配置为使用你的 Android SDK 目录。如果你的设备是第一次连接到 Mac，可能需要在设备上信任这台计算机。通常，当你连接设备时，设备上会弹出一个对话框，要求你确认是否信任连接的计算机。确保你连接的设备是支持开发的应用的 iOS 版本。确保你已经用 USB 线将你的 Android 设备连接到了你的计算机。确保你已经用 USB 线将你的 iOS 设备连接到了你的 Mac。确保你的 Mac 上的安全软件或防火墙没有阻止设备与计算机的通信。
2024-10-23 09:17:21
1428
1
原创 React Native 持久化数据
是一个简单且有效的选择。对于需要更复杂查询或大量数据的应用，使用 SQLite 或 Realm 可能更合适。对于敏感数据，使用安全存储是必要的。在 React Native 中，持久化数据是指将数据保存在设备上，以便在应用重新启动后仍然可以访问。选择哪种持久化方法取决于你的应用需求、数据的大小和复杂性，以及对安全性的要求。
2024-10-22 08:56:46
1240
原创 ReactNative项目根据平台去判断允许用户是热更新还是强更新或者若更新
请注意，这只是一个基本的示例，实际的更新逻辑可能会更复杂，并且需要集成具体的更新服务和逻辑。此外，无论选择哪种更新策略，都应该确保遵守相应平台的政策，并提供良好的用户体验。基于以上因素，你可以在代码中使用条件判断来实现不同平台的不同更新策略。
2024-10-18 08:58:33
409
uniapp打包流程详细介绍
2024-05-24
空空如也
TA创建的收藏夹 TA关注的收藏夹
TA关注的人