使用 vue 搭建了一个主题模版，希望能帮助到主题开发者

luyaoyao

项目地址

使用 vue 搭建的 halo 主题项目模版

制作这个项目的原因

由于目前主题不满足我的需求，所以诞生了自己做主题的想法，在制作的过程中，发现直接用 freemarker + html + css 的方式制作主题非常费劲，不太符合目前的前端开发体验。为了提高生产效率，于是搭建了这个项目结构，将数据获取和 html + css 两部分分开，使用 vue 搭建项目，希望能帮助大家提高开发效率，开发出更多更加优秀的 halo 主题。

项目结构

project
    |- build 配置文件
    |- dist 打包后的文件
    |- module
        |- layout 布局
        |- state 数据源
    |- src 源码文件
    |- static 静态文件

Ryan Wang 👍

你做了我一直想做却还没做的事，晚点好好研究研究。

luyaoyao

Ryan Wang 👍 大佬可以基于这个思路封装一个类似于 vue-cli 的脚手架，直接通过脚手架创建主题模版，体验应该会更好

luyaoyao

Ryan Wang 👍 大佬可以给我一个置顶么，让更多主题开发者看到这个项目

Takagi

建议增加一个 API 文件夹用来获取所有的数据。其实更好的做法是将现有的所有 halo 获取数据的请求封装起来，这样更能方便其他人使用你的这个接口

luyaoyao

Takagi 封装所有请求的 api 可以直接整合到 https://github.com/halo-dev/halo-js-sdk 这个项目里面了，统一走 http 就行，不需要再用 freemarker 了

Ryan Wang 👍

详细看了一下你这个方案，很巧妙，但是不推荐使用这样的方式获取数据，太繁琐。因为目前是提供的 content api 的。

使用 vue 来开发模板是没有任何问题的，使用 vue cli 创建的项目构建后把 index.html 重命名成 index.ftl 即可使用，问题在于 SEO，目前没有很好的办法解决这个问题。

而且我们创建了一个 js sdk，你可以看看，但目前不是很完整，你可以考虑贡献一下。

https://github.com/halo-dev/halo-js-sdk

luyaoyao

Ryan Wang 👍 原来 http 接口已经有了，那就可以直接用请求拉数据了，用 freemarker 注入数据确实费劲。大佬，那 halo 官网文档该更新一下了，不看代码确实不知道已经有 api 接口了。

toolse

Ryan Wang 👍 Vue想做SEO优化也是可以的，只能使用SSR方式开发主题就可以做好SEO，Vue官方也是提供了SSR开发流程

aero

Ryan Wang 👍 大佬，现在这个jdk完整了吗🤣

筱筱动力

Ryan Wang 👍 大佬 ,官网文档里没写有sdk和content api呀,还好在这找到了,虽然git组织里也有

Ryan Wang 👍

luyaoyao docs.halo.run

新文档，随着下个版本发布。

luyaoyao

Ryan Wang 👍 棒

toolse

luyaoyao 使用freemarker，对于主题开发者而言，确实有很大的限制，因为现在前端框架都会有框架内置的模板引擎

Ponking

我觉得很ok

toolse

希望作者能推出一个Vue3+Vite+[TypeSrcipt]主题开发的目录结构

Ryan Wang 👍

toolse 其实现在就可以支持。我们有提供 Content API 的 SDK。

https://github.com/halo-dev/js-sdk

但目前处于 alpha 状态。

ronaldoxzb

Ryan Wang 👍 到时候halo也前后端分离下

toolse

Ryan Wang 👍 希望作者在开发SDK的同时能够推出一套友好的项目结构，一种Vue客户端渲染方式的项目结构，一种Vue服务端渲染方式的项目结构，同时希望作者能对这两者渲染方式提出他们对Halo主题开发的优缺点，让开发者们自己去做选择

toolse

ronaldoxzb 现在就是前后端分离的

Ryan Wang 👍

aero sdk 吗，我们都有几个项目用上了

aero

Ryan Wang 👍 sdk哇，好的好的，我试试Nuxt.js开发，调用接口，完整的就好了