将文章都写在 📁 /content/article 文件夹中。

代码块的高亮引擎是 Shiki，它提供了大量的高亮主题。

BlogiNote 代码块的默认高亮主题是 one-dark-pro，你可以在 nuxt.config.ts 文件中设置 theme 属性以更改它。

例如我希望将高亮主题更改为 github-dark：

export default defineNuxtConfig({
  content: {
    highlight: {
      theme: 'github-dark'
    }
  }
})

代码块的高亮引擎是 Shiki，它支持对上百种编程语言进行代码高亮。

BlogiNote 已经预载支持了一些常用的编程语言，使用这些编程语言书写的代码块可以被正确高亮标注。

默认预载支持 11 中编程语言：

• 'diff'
• 'json'
• 'js'
• 'ts'
• 'css'
• 'shell'
• 'html'
• 'md'
• 'yaml'
• 'vue'
• 'python'

如果你希望代码块支持高亮更多类型的编程语言，可以在 nuxt.config.ts 文件中设置 preload 属性

例如我想用 ssh-config 编程语言书写代码块。

首先，我应该查看该页面确保 Shiki 支持这种编程语言。

然后在 nuxt.config.ts 文件中进行配置：

export default defineNuxtConfig({
  content: {
    highlight: {
      preload: ['ssh-config']
    }
  }
})

如果你想用 Shiki 并不支持的编程语言书写代码块，你可以将代码块的编程语言设置为 md 或 markdown 作为次级解决方案。

但是这个方法有一个小缺陷，就是 md 或 markdown 标签会出现在代码块的右上角，这可能会让读者感到疑惑。

你可以通过一个较为取巧的方法来解决这个小缺陷，通过同时提供代码来源文件的信息，这个信息里需要包含文件拓展名。

例如我想在代码块中写一些纯文本，但是我必须将编程语言设置为 md 因为 Shiki 并不支持高亮类型为 .txt 的内容。

但是我可以同时提供来源文件信息 [introduction.txt]

以下显示的代码块可以正确高亮，而且「编程语言」信息也是正确的：

Thanks a lot to use BlogiNote

你可以更改顶部导航栏左侧的 Logo，以及在浏览器标签栏上网站的图标。

将 logo 图片放置在 📁 /public 文件夹中，并在 app.config.ts 文件中设置 avatar 属性。

将图标文件放置在 📁 /public 文件夹中，并在 app.config.ts 文件中设置 favicon 属性。

export default defineAppConfig({
  theme: {
    // for example you add a image named avatar.png to public folder as the logo
    avatar: 'avatar.png',
    // add a image named favicon.ico to public folder as the icon of your webpage
    favicon: 'favicon.ico',
  }
})

如果你想迁移你的部落格，你应该先备份你的数据。

你所创建的数据在以下文件夹中：

• 你写的所有文章都在 📁 /content/article 文件夹中。
• 📁 /public 文件夹中有一些你上传的图片。

请持续关注 BlogiNote 项目在 npm 主页的版本变更。

如果有新的版本发布，你可以在 package.json 文件中作出相应的修改，以升级 BlogiNote

{
  "devDependencies": {
    "bloginote": "3.0.0",
    "nuxt": "3.0.0-rc.11"
  }
}

{
  "scripts": {
    "dev": "nuxi dev",
    "build": "nuxi build",
    "generate": "nuxt generate && npx pagefind --source dist",
    "preview": "nuxi preview",
    "lint": "eslint ."
  },
}

export default defineAppConfig({
  bloginote: {
    // ...
  }
})