uni-halo + 微信小程序开发实录:我的第一个作品诞生记

简介: 这篇文章介绍了使用uni-halo框架进行微信小程序开发的过程,包括选择该框架的原因、开发目标以及项目配置和部署的步骤。

前言

作为一个独立开发者(或技术爱好者),我在选择微信小程序开发框架时,主要考虑了以下几个因素:

  1. 开发效率

    • 我不想从零开始搭建项目,希望有一个开箱即用的解决方案,快速实现想法。

    • uni-halo 基于 Vue.js,语法友好,学习曲线平缓,适合个人快速迭代。

    • 配置方便,可在 Halo 控制台配置相关信息

  2. 跨平台能力

    • 虽然目前目标是微信小程序,但未来可能会扩展到其他平台(如H5、App)。

    • uni-halo 的跨端编译能力,让代码复用成为可能,减少后续适配成本。

  3. 轻量化和社区支持

    • 相比完整版 uni-app,uni-halo 更轻量,适合个人项目,避免冗余配置。

    • 尽管生态不如原生微信开发完善,但足够满足基础需求,且社区教程逐渐增多。

最终目标:用最低的学习成本,快速上线一个功能完整、界面美观的个人小程序!

关于 uni-halo

uni-halo 是一个基于 Halo 2.x 提供的 API 接口,开发的一套开源的博客应用。

  • 完全免费开源,包括程序源码、插件源码

  • 页面支持插件配置

  • 使用最新流行的技术栈

  • 支持特色功能,恋爱日记

  • 支持编译为:小程序(推荐)APPH5

uni-halo 项目依赖于 Halo 2.x 版本程序的项目 API 接口,如果您没有使用 Halo 2.x 或者使用的是其他的博客程序,您无需再继续往下看

环境准备

  • DCloud 账号(该账号用于登录 HBuilder X 开发工具和编译 uni-halo 项目)

  • 微信小程序账号(该账号用于发布和上线微信小程序)

  • HBuilderX(官方IDE,支持 uni-halo 开发,用于将 uni-halo 编译或上传到 微信小程序开发工具

  • 微信开发者工具(用于调试和发布 uni-halo 小程序到微信开放平台上线发布)

  • 推荐 Node.js 版本:14/16/18

运行项目

1、克隆源码

git clone https://github.com/ialley-workshop-open/uni-halo.git

2、打开开发工具 HBuilder X 工具,点击左上角 文件-导入-从本地导入 ,找到下载好的 uni-halo 源码

3、修改配置,配置是一个非常重要的步骤,在配置完成后,才能正常使用小程序,配置分为 源码配置和 插件配置。

  • 源码配置:在 uni-halo 源码的 config 目录中,找到 token.config.json 文件,按照提示进行配置。

  • 插件配置:在 Halo 后台的 插件管理 中,找到 UniHalo配置 插件,按照提示进行配置。

先将仓库 fork 到自己的仓库中,然后再 clone 到本地,使用 main 分支。

uni-halo 配置

1、生成 Token

登录后台,点击左下角的用户头像,进入个人中心 选择 我的-个人令牌,新建令牌,如图:

image.png

2、Token 配置

在项目根目录下找到 token.config.template.js 修改为 token.config.js 文件:

import {getAppConfigs} from "@/config/index";

/** 配置博客的内容 */
const UniHaloConfig = Object.freeze({

    /** 基础请求域名:你的Halo博客基础域名 */
    BASE_API: "https://baiwumm.com",
    /** Halo 插件后台配置 */
    systemToken: getAppConfigs()?.basicConfig?.tokenConfig?.personalToken,
})

export default UniHaloConfig;

3、插件配置

image.png

UniHalo 的具体配置,可以去插件中查看!

相关链接

1、调试预览

2、小程序发布

3、官方文档

4、代码仓库

界面预览

欢迎页 首页 分类
欢迎页 首页 分类
图库 文章分享 关于
图库 文章分享 关于

开发体验总结

"学习成本低,上手快,成就感满满!"

使用 uni-halo 开发微信小程序的体验非常流畅,整个过程几乎没有遇到太大的阻碍。相比原生开发,它的开箱即用特性让我节省了大量配置时间——只需克隆模板项目,简单修改配置,就能快速预览效果,这种"低代码"的体验让开发变得轻松愉快。

虽然过程中遇到了一些小问题(比如微信 API 的适配),但通过查阅文档和社区讨论都能很快解决。每完成一个功能,看到小程序在手机上流畅运行,那种"我真的做出来了!"的成就感,正是独立开发者最享受的时刻。

如果你也想快速实现一个小程序创意,uni-halo 会是个让人惊喜的选择。它既保留了 Vue.js 的优雅,又提供了微信生态的完整支持,让个人开发者能专注于产品本身,而不是繁琐的环境搭建。

一句话总结:
"从零到上线的过程出乎意料的顺利—— uni-halo 让个人开发者也能轻松做出专业级小程序!"

相关文章
|
4月前
|
人工智能 小程序 前端开发
一个小程序轻量AR体感游戏,开发实现解决方案
针对青少年运动兴趣不足问题,AR体感游戏凭借沉浸式互动体验脱颖而出。结合小程序“AI运动识别”插件与WebGL渲染技术,可实现无需外设的轻量化AR健身游戏,如跳糕、切水果等,兼具趣味性与锻炼效果,适用于儿童健身及职工团建,即开即玩,低门槛高参与。
|
4月前
|
移动开发 小程序 前端开发
小程序开发平台有哪些?哪个好
小程序的开发方式丰富多元,开发团队可根据自身的技术背景、项目具体需求以及资源状况,灵活挑选最为适宜的开发路径。以下将详细介绍几种主流的小程序开发方式。
488 1
|
4月前
|
运维 小程序 数据可视化
小程序开发平台有哪些?SaaS小程序制作平台哪个好
小程序开发模式详解:自主开发、SaaS小程序制作平台与外包全对比 选择合适的小程序开发模式,是项目成功的基石。这三种模式在成本、周期、控制力和灵活性上各有千秋,适用于不同阶段和不同类型的企业。下面我们将逐一深入剖析。
371 7
|
4月前
|
移动开发 小程序 前端开发
小程序快速开发平台有哪些?
小程序开发并非“一刀切”,需结合技术储备、资金预算、时间规划及功能需求等多维度因素综合考量。以下为您详细拆解五种主流开发方案及其适用场景,助您精准匹配开发路径。
299 3
|
4月前
|
移动开发 小程序 前端开发
小程序开发平台有哪些?小程序开发制作软件推荐
小程序开发方案全解析:5种主流方式与选择指南 小程序开发需根据技术能力、预算、时间及功能需求综合决策。以下为5种主流开发方案及适用场景分析:
25858 0
|
5月前
|
消息中间件 人工智能 Java
抖音微信爆款小游戏大全:免费休闲/竞技/益智/PHP+Java全筏开源开发
本文基于2025年最新行业数据,深入解析抖音/微信爆款小游戏的开发逻辑,重点讲解PHP+Java双引擎架构实战,涵盖技术选型、架构设计、性能优化与开源生态,提供完整开源工具链,助力开发者从理论到落地打造高留存、高并发的小游戏产品。
|
9月前
|
小程序 前端开发 Android开发
小程序微信分享功能如何开发?开放平台已绑定仍不能使用的问题?-优雅草卓伊凡
小程序微信分享功能如何开发?开放平台已绑定仍不能使用的问题?-优雅草卓伊凡
1858 29
小程序微信分享功能如何开发?开放平台已绑定仍不能使用的问题?-优雅草卓伊凡
|
8月前
|
监控 数据可视化 数据处理
微信养号脚本,全自动插件,AUTOJS开发版
这是一套自动化微信养号工具,包含主脚本`wechat_auto.js`与配置文件`config.json`。主脚本实现自动浏览朋友圈、随机阅读订阅号文章及搜索指定公众号三大功能,支持自定义滚动次数、阅读时长等参数。代码通过随机化操作间隔模拟真实用户行为,具备完善的错误处理和日志记录功能。配套UI模块提供可视化操作界面,可实时监控任务状态与运行日志,便于调整参数设置。控制器部分扩展了批量数据处理能力,如学生信息的增删改查操作,适用于多场景应用。下载地址:https://www.pan38.com/share.php?code=n6cPZ 提取码:8888(仅供学习参考)。

热门文章

最新文章