Skip to content

Latest commit

 

History

History
103 lines (81 loc) · 4.06 KB

搭建文档.md

File metadata and controls

103 lines (81 loc) · 4.06 KB

搭建文档

今天试了试 astro,感觉真不错,文档整体阅读下来体验很舒服,跑起来也很快,一整个感觉很现代,而且 next 味好浓,next + tailwind 秒入门了~

  • 项目结构 使用 astro 项目结构,阅读 astro 文档以了解项目结构。
  • Prettier 格式化 这次试了试 prettier-plugin-lint-md 感觉挺好的,可以格式化 markdown 文件,遵循中文技术文档的写作规范
  • 从 hexo 迁移 多亏这篇文章:再见 Hexo,你好 Astro! 首先的问题是 link to 的迁移,因为 hexo 的 link 和 astro 的 page 冲突,需要使用内容集功能

    不过好在 Astro 处理起来并不复杂。只需创建一个名为 post/[slug]/index.astro 的页面,并在此页面中处理链接,将其与 md 文件中的 permalink 字段进行映射即可。


2025.01.07 今天加了 husky 和 lint-staged 2025.01.17 今天加了 tags 页面 2025.01.18 今天加了 RSS 订阅

感兴趣的

  1. Storyblok-Astro Storyblok-Astro 是一个为 Astro 框架开发的 Storyblok CMS 集成工具。支持可视化编辑器、支持动态路由、内容管理集成
  2. Spotlight Spotlight 是 Sentry 的错误监控工具,可以监控 Astro 应用程序的错误,并提供详细的错误报告和解决方案,Spotlight 是一个专门为 Astro 应用程序开发的工具包。它可以通过一个简单的命令就能将 Spotlight 功能集成到 Astro 应用中。
  3. 白水推荐的 astro-loading-indicator,很方便地搞定加载提示
  4. astro-tooltips 一个简单的工具提示组件,可以方便地添加到 Astro 项目中。
  5. astro-icon 这个库可以让你在 astro 项目中使用 iconify 的图标,很方便。
  6. prettier-plugin-astro 这篇文章介绍了如何在 Astro 3.0 项目中设置 Prettier 来自动排序 Tailwind CSS 类。

致谢

感谢以下所有 astro 博客的仓库代码参考让我少走很多弯路~

关于老 shoka 迁移

写了个脚本转换 shoka 中的分类

/scripts/transformShokaConfig.ts

原 shoka 主题的分类配置是 yaml 格式,需要转换为 json 格式,方便 astro 使用。

category_map:
  随笔: life

  笔试面经: review
  笔试复盘: exam-record
  面经: interview

  题目记录: coding-train
  竞赛: contest
  字节校园: bytedance
  剑指offer: offer

  项目集锦: project

  笔记: note
  青训营笔记: bytedance-note
  算法: algorithm
  后端: back-end
  前端: front-end
  JavaScript: javascript
  React: react
  CS基础: cs-basics
  数据结构: data-structure

  工具: tools

转换后

分类映射已成功转换: {
  '随笔': 'life',
  '笔试面经': 'review',
  '笔试复盘': 'exam-record',
  '面经': 'interview',
  '题目记录': 'coding-train',
  '竞赛': 'contest',
  '字节校园': 'bytedance',
  '剑指offer': 'offer',
  '项目集锦': 'project',
  '笔记': 'note',
  '青训营笔记': 'bytedance-note',
  '算法': 'algorithm',
  '后端': 'back-end',
  '前端': 'front-end',
  JavaScript: 'javascript',
  React: 'react',
  'CS基础': 'cs-basics',
  '数据结构': 'data-structure',
  '工具': 'tools'
}

scripts/transformShokaConfig.ts