TinyTale 小程序-Halo2首款个人博客小程序

TinyTale 微信小程序

TinyTale 是一款基于 Halo 博客系统的微信小程序,可以展示博客文章、图库、瞬间等内容。简洁、美观、易用,是你的博客的最佳搭档。

更新日志

预览

image


 

image

image

111.png

注:图中二维码即为演示

文档

TinyTale

技术栈

特性

  •  文章列表
  •  文章详情
  •  分类列表
  •  图库展示
  •  瞬间展示
  •  评论展示
  •  发布图库
  •  发布瞬间
  •  配套插件

Next

  •  优化文章样式
  •  优化代码结构
  •  ......

快速开始

第一步,安装插件

首先我们需要安装 TinyTale 配套插件,插件地址为 TinyTale插件

第二步,配置插件

在 Halo 后台管理系统中,找到 插件 -> TinyTale -> 设置,配置小程序相关设置

生成管理员token

在 Halo 后台管理系统中,生成一个管理员token,用于小程序的发布和管理。如果你不知道需要哪些权限就全给它吧。

第三步,配置小程序

在 src/config 目录下的 base.ts 文件中配置小程序相关信息

// 项目名称
  title: 'TinyTale
  // 项目版本
  version: '1.0.0',
  // 通讯地址,一般为你的halo博客地址, 不要带末尾反斜杠
  BASE_URL: '',
  // 网站地址用于拼接原文链接
  WEB_URL: '',

Copy

第四步,uni-app

修改src/manifest.json 文件,重新获取appid

第五步,下载依赖

yarn
或
yarn install

Copy

启动项目

yarn run dev:mp-weixin

Copy

此时会在 dist/dev/mp-weixin 目录下生成小程序代码,可以使用微信开发者工具打开该目录进行预览。

单位转换

  • rem->rpx (默认开启, uvtw 的 rem2rpx 选项)
  • px -> rpx (默认不开启,可反注释 postcss.config.cjs 中的 postcss-pxtransform 开启配置)

Tips

  • 升级 uni-app 依赖的方式为 npx @dcloudio/uvm 后,选择对应的 Package Manager 即可。而升级其他包的方式,可以使用 yarn upgradeInteractive --latest,这个是 yarn 自带的方式。
  • 另外暂时不要升级 pinia 的版本,不然会报hasInjectionContext相关的错误 ,详见 pinia/issues/2210

更多可以查看原文地址:TinyTale Halo微信小程序正式版发布

  • 13
    点赞
  • 14
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
WeHalo [wiˈheɪloʊ],意为我们的光环,嘻嘻。配合 Halo 轻快,简洁,功能强大的博客系统而开发出来的 简约风 微信小程序版博客QQ交流群: 260050047快速开始注:开源不易请留 WeHlo 底部署名不要删除git clone https://github.com/aquanlerou/WeHalo.git代码下载后,把 image 文件夹删除(放的是README中的图片与项目无关),用小程序 IDE 打开后即可使用。注:请选择小程序项目,非小游戏,例子中无 appid,所以无法在手机上运行,如果需要真机调试,请在打开例子时,填上自己的小程序 id文档修改app.js文件的全局变量,改为你的 Halo 博客的地址注:必须是HTTPS的因为,微信官方规定,还有把你的博客地址如:https://blog.eunji.cn添和https://v2.jinrishici.com加到微信公众平台的 request 合法域名中globalData: { //全局变量     URL: "https://blog.eunji.cn",   //你的地址     blogName: "AquanBlog",   //博客名字     TOKEN: "YouToken"   //Halo后台的Token }修改app.json文件更改小程序导航栏标题,改为你的博客名字"navigationBarTitleText": "AquanBlog",  //你的博客名字修改index.wxss文件更改首页封面背景图片,找到.aquanblog.aquanblog {     //填上你想要的封面图片链接     background-image: url("https://blog.eunji.cn/upload/2018/10/maximilian-weisbecker-544039-unsplash20181109154144125.jpg"); }修改poster.js文件更改 生成海报 功能附带你小程序宣传图片(图片可以在微信公众平台下载宣传物料获取放到你的服务器获取图片链接){     type: 'image',     //改为你的小程序宣传图片链接     url: 'https://blog.eunji.cn/upload/2018/11/wx20181208174737572.png',     css: {         width: '600rpx',         height: '167rpx',         mode: 'scaleToFill',         top: '433rpx',     } },html2wxml插件版本准备添加插件 搜索 html2wxml ,选中并添加 添加成功 文档正在不断完善中,遇到问题请加群提问或者 Issues 等你吐槽...演示
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值