安装到已有站点
赞助
成为我们的资助者或赞助商，以支持我们的工作。
本页内容
赞助商
本文介绍如何安装 HB 和模块到已有站点。
初始化 Hugo 模块
如果站点目录有
go.mod，则跳过本步骤，因为你已经初始化过模块了。我们需要初始化站点，使其作为一个模块，以使用 Hugo 模块。请将 github.com/user/repo 替换为你的。
1hugo mod init github.com/user/repo
安装构建工具
HB 要求安装一些构建工具。
调整配置
本教程使用推荐的元模块作为使用 HB 的起点，你可以在模块页面找到更多可用的模块。
- 如果存在
theme，则删除。 - 确保设置了以下必要的配置。
hugo.toml
1[build]
2 writeStats = true
3[markup]
4 [markup.goldmark]
5 [markup.goldmark.renderer]
6 unsafe = true
7 [markup.highlight]
8 lineNos = true
9 lineNumbersInTable = false
10 noClasses = false
11[module]
12 [[module.imports]]
13 path = 'github.com/hbstack/meta/recommended'
14[outputs]
15 home = ['HTML', 'Offline', 'RSS', 'SearchIndex', 'WebAppManifest']
16[permalinks]
17 blog = '/blog/:year/:month/:title'
18[taxonomies]
19 authors = 'authors'
20 categories = 'categories'
21 series = 'series'
22 tags = 'tags'
hugo.yaml
1build:
2 writeStats: true
3markup:
4 goldmark:
5 renderer:
6 unsafe: true
7 highlight:
8 lineNos: true
9 lineNumbersInTable: false
10 noClasses: false
11module:
12 imports:
13 - path: github.com/hbstack/meta/recommended
14outputs:
15 home:
16 - HTML
17 - Offline
18 - RSS
19 - SearchIndex
20 - WebAppManifest
21permalinks:
22 blog: /blog/:year/:month/:title
23taxonomies:
24 authors: authors
25 categories: categories
26 series: series
27 tags: tags
hugo.json
1{
2 "build": {
3 "writeStats": true
4 },
5 "markup": {
6 "goldmark": {
7 "renderer": {
8 "unsafe": true
9 }
10 },
11 "highlight": {
12 "lineNos": true,
13 "lineNumbersInTable": false,
14 "noClasses": false
15 }
16 },
17 "module": {
18 "imports": [
19 {
20 "path": "github.com/hbstack/meta/recommended"
21 }
22 ]
23 },
24 "outputs": {
25 "home": [
26 "HTML",
27 "Offline",
28 "RSS",
29 "SearchIndex",
30 "WebAppManifest"
31 ]
32 },
33 "permalinks": {
34 "blog": "/blog/:year/:month/:title"
35 },
36 "taxonomies": {
37 "authors": "authors",
38 "categories": "categories",
39 "series": "series",
40 "tags": "tags"
41 }
42}
更改 PWA 缓存策略
为了避免本地环境的缓存问题，建议更改 PWA 缓存策略。
config/development/params.toml
1[pwa]
2 [pwa.caches]
3 [pwa.caches.font]
4 strategy = 'network-first'
5 [pwa.caches.image]
6 strategy = 'network-first'
7 [pwa.caches.script]
8 strategy = 'network-first'
9 [pwa.caches.style]
10 strategy = 'network-first'
config/development/params.yaml
1pwa:
2 caches:
3 font:
4 strategy: network-first
5 image:
6 strategy: network-first
7 script:
8 strategy: network-first
9 style:
10 strategy: network-first
config/development/params.json
1{
2 "pwa": {
3 "caches": {
4 "font": {
5 "strategy": "network-first"
6 },
7 "image": {
8 "strategy": "network-first"
9 },
10 "script": {
11 "strategy": "network-first"
12 },
13 "style": {
14 "strategy": "network-first"
15 }
16 }
17 }
18}
预览和调整
现在你应该可以启动 Hugo 服务器以预览，以及调整模块。
问题排查
导致构建失败的原因有很多。
- 缺少之前主题的短代码。
- 与之前的配置和参数冲突。
- 更多请参阅问题排查页面。
如果你不知道如何解决，请随意提问。
