使用腾讯云和 mac 搭建个人博客
Table of Contents
一直以来想自己做个博客，慢慢的做一些自媒体的东西，但是一直也没有下决心，除了自身懒惰之外，很多也是觉得自己能力不够，但事情总得开始，希望就从 hugo+hugoplate 开始。
为什么会选择 hugo
其实没有什么很特别的原因，更多的是因为 wordpress 不适合我。wordpress 太折腾，我也买了收费主题，但是光一个 elementor 插件就折腾我半天，效率太低了。
很多人因为 hugo 的静态特点，考虑访问速度选择了 hugo，但是我觉得就个人博客而言，能有多少内容。并且因为我手上有个 2u8g 的腾讯云轻量服务器，当时便宜买了 5 年，闲着也是闲着。
对于主题，我个人还是希望能够好看，暂时先选了 hugoplate。
期望的效果
简单来说，我希望可以用我的 mac 电脑编写博客，通过腾讯云发布，那我们就开始！
安装过程
Mac端
安装 Homebrew
网址
安装 Homebrew
/bin/bash -c "$(curl -fsSL https://raw.githubusercontent.com/Homebrew/install/HEAD/install.sh)"
brew update
- 设置环境变量
以前每个新用户的默认 shell 是/bin/bash，那么这里我们需要配置文件为~/.bash_profile，从macOS Catalina(10.15.x) 版开始，Mac 使用/bin/zsh作为默认 Shell ，其对应的配置文件为~/.zshrc
- ARM-zsh
echo 'eval "$(/opt/homebrew/bin/brew shellenv)"' >> ~/.zprofile
eval "$(/opt/homebrew/bin/brew shellenv)"
- ARM-bash
echo 'eval "$(/opt/homebrew/bin/brew shellenv)"' >> ~/.bash_profile
eval "$(/opt/homebrew/bin/brew shellenv)"
- Intel-zsh
echo 'eval "$(/usr/local/Homebrew/bin/brew shellenv)"' >> ~/.zprofile
eval "$(/usr/local/Homebrew/bin/brew shellenv)"
- Intel-bash
echo 'eval "$(/usr/local/Homebrew/bin/brew shellenv)"' >> ~/.bash_profile
eval "$(/usr/local/Homebrew/bin/brew shellenv)"
安装 Git、Go、Dart Sass、node.js
1、安装 Git
默认mac 下是安装 Git 的，但我们还是安装最新版 Git
- brew 安装
brew install git
- 验证是否安装成功
git --version
2、安装 Go
- brew 安装
brew install go
- 验证是否安装成功
go version
- 配置 Go 环境变量（可选）
echo 'export GOPATH=$HOME/go' >> ~/.zshrc
echo 'export PATH=$PATH:$GOPATH/bin' >> ~/.zshrc
source ~/.zshrc
3、安装 Dart Sass
Dart Sass 是 Sass 的官方实现，用于将 SCSS/Sass 文件转译为 CSS。
- brew 安装
brew install dart-sdk
- 装完 dart-sdk 后，需要使用 Dart 包管理器（pub）全局安装 Sass。
dart pub global activate sass
- 将 Dart pub 全局路径添加到你的 PATH 变量中。对于 zsh，将以下内容添加到你的 ~/.zshrc 中。
export PATH="$PATH":"$HOME/.pub-cache/bin"
- 验证安装
sass --version
4、安装 node.js
- 安装nvm
bash -c "$(curl -fsSL https://gitee.com/RubyMetric/nvm-cn/raw/main/install.sh)"
- 环境变量
source ~/.nvm/nvm.sh
- 验证是否安装成功
nvm -v
- 安装 node.js（最新的长期支持版本）
nvm install 22.12.0
安装 Hugo
- brew 安装
brew install hugo
- 验证是否安装成功
hugo version
如果显示类似 Hugo Static Site Generator vX.X.X/extended 的信息，表示安装成功。
安装主题 hugoplate
参考官方这个视频，很简单
腾讯云配置
其实对于云端的配置，有两种方案，一是在服务器上安装 Nginx做代理即可，对于这种方式网上一大堆资料，在这里不再赘述，这种方案对于小白比较麻烦；另一种方案，安装宝塔面板，直接在面板配置，全是图形化界面，用起来很方便。
- 创建 HTML站点，用自己的域名解析
- 添加 SSL 证书，宝塔有免费的证书，也可以用自己的证书
上传博客网站
- 在编辑器终端运行
npm run build，对网站进行编译
valen@Valens-mn www % npm run build
> hugoplate@1.18.1 build
> hugo --gc --minify --templateMetrics --templateMetricsHints --forceSyncStatic
Start building sites …
hugo v0.140.1+extended+withdeploy darwin/arm64 BuildDate=2024-12-23T16:26:35Z VendorInfo=brew
Template Metrics:
cumulative average maximum cache percent cached total
duration duration duration potential cached count count template
---------- -------- -------- --------- ------- ------ ----- --------
169.473789ms 4.345481ms 16.469958ms 100 95 37 39 partials/essentials/script.html
91.493834ms 15.248972ms 33.502417ms 0 0 0 6 authors/single.html
84.703914ms 2.171895ms 21.746042ms 76 0 0 39 partials/essentials/head.html
69.761041ms 1.788744ms 21.646417ms 69 0 0 39 partials/basic-seo.html
58.419879ms 1.497945ms 8.418541ms 100 95 37 39 partials/essentials/style.html
54.059292ms 6.757411ms 29.563125ms 0 0 0 8 _default/taxonomy.html
42.5595ms 21.27975ms 23.443292ms 0 0 0 2 blog/list.html
41.426ms 10.3565ms 22.420958ms 0 0 0 4 _default/single.html
38.645458ms 3.864545ms 17.1685ms 95 0 0 10 partials/components/blog-card.html
36.835541ms 18.41777ms 22.6095ms 0 0 0 2 blog/single.html
32.014837ms 820.893µs 2.999875ms 98 0 0 39 partials/essentials/header.html
31.452834ms 15.726417ms 30.423334ms 0 0 0 2 about/list.html
30.729708ms 15.364854ms 28.335291ms 0 0 0 2 index.html
29.956042ms 7.48901ms 26.462875ms 0 0 0 4 _default/terms.html
25.765625ms 12.882812ms 24.740333ms 0 0 0 2 contact/list.html
23.2775ms 11.63875ms 21.573416ms 0 0 0 2 authors/list.html
22.772541ms 5.693135ms 19.492875ms 0 0 0 4 _default/list.html
22.198957ms 284.602µs 1.406542ms 100 0 0 78 partials/logo.html
15.132916ms 540.461µs 2.947917ms 38 0 0 28 partials/image.html
9.211539ms 236.193µs 934.375µs 99 0 0 39 partials/essentials/footer.html
8.697292ms 4.348646ms 8.248375ms 0 0 0 2 shortcodes/gallery.html
7.324834ms 305.201µs 1.46775ms 100 0 0 24 partials/image-pipe.html
4.19258ms 113.312µs 2.475875ms 100 100 37 37 partials/favicon
2.998792ms 1.499396ms 2.52175ms 0 0 0 2 _default/list.searchindex.json
2.548291ms 637.072µs 1.339166ms 81 0 0 4 partials/searchImage.html
2.3755ms 1.18775ms 2.290583ms 0 0 0 2 partials/favicon.html
2.348334ms 90.32µs 397.583µs 0 0 0 26 _internal/_default/rss.xml
2.303332ms 88.589µs 226µs 80 0 0 26 partials/page-header.html
1.962421ms 50.318µs 189.25µs 86 0 0 39 partials/components/language-switcher.html
1.643374ms 42.137µs 142.541µs 75 0 0 39 partials/search-index.html
1.450292ms 241.715µs 656.625µs 97 0 0 6 partials/components/author-card.html
1.433833ms 716.916µs 1.395ms 0 0 0 2 _default/index.webmanifest
1.269918ms 32.562µs 105.208µs 77 0 0 39 partials/search-modal.html
1.130581ms 43.483µs 139.833µs 77 0 0 26 partials/components/breadcrumb.html
995.5µs 995.5µs 995.5µs 0 0 0 1 404.en.html
992.623µs 25.451µs 347.042µs 100 95 37 39 partials/site-verifications.html
894.542µs 447.271µs 753.917µs 0 0 0 2 shortcodes/image.html
858.292µs 429.146µs 475.167µs 0 0 0 2 partials/widgets/widget-wrapper.html
847.837µs 21.739µs 150.875µs 100 0 0 39 partials/components/theme-switcher.html
804.793µs 402.396µs 457.959µs 0 0 0 2 shortcodes/slider.html
723.168µs 12.687µs 150.292µs 0 0 0 57 _default/_markup/render-link.html
641.042µs 320.521µs 405.5µs 0 0 0 2 _internal/_default/sitemap.xml
509.161µs 13.055µs 77.291µs 100 95 37 39 partials/preloader.html
506.586µs 12.989µs 231.792µs 94 0 0 39 partials/mermaid/assets/js.html
374.254µs 9.596µs 55.667µs 100 95 37 39 partials/announcement.html
299.457µs 7.678µs 42.041µs 100 95 37 39 partials/gtm-noscript.html
227.249µs 113.624µs 149.916µs 0 0 0 2 shortcodes/tabs.html
222.375µs 111.187µs 185.25µs 98 0 0 2 partials/social-share.html
208.71µs 26.088µs 100.084µs 0 0 0 8 shortcodes/notice.html
176.208µs 88.104µs 129.083µs 0 0 0 2 _internal/shortcodes/youtube.html
175.376µs 87.688µs 160.917µs 100 0 0 2 partials/components/pagination.html
162.583µs 27.097µs 82.083µs 0 0 0 6 shortcodes/accordion.html
140.167µs 70.083µs 113.417µs 0 0 0 2 _default/_markup/render-table.html
133.163µs 3.414µs 46.625µs 100 95 37 39 partials/gtm.html
127.708µs 63.854µs 118.25µs 0 0 0 2 partials/manifest.html
118.792µs 59.396µs 89.667µs 97 0 0 2 partials/widgets/tags.html
118.042µs 59.021µs 95.792µs 0 0 0 2 shortcodes/button.html
115.292µs 38.43µs 92.084µs 0 0 0 3 _internal/alias.html
114.875µs 57.437µs 98.458µs 0 0 0 2 shortcodes/video.html
113.251µs 56.625µs 85.834µs 96 0 0 2 partials/widgets/categories.html
110.041µs 18.34µs 80.958µs 0 0 0 6 shortcodes/tab.html
110µs 55µs 96.75µs 0 0 0 2 _default/_markup/render-codeblock-mermaid.html
86.041µs 43.02µs 70.833µs 81 0 0 2 partials/toc.html
76.917µs 38.458µs 72.167µs 100 0 0 2 partials/pwa.html
74.709µs 37.354µs 66.75µs 0 0 0 2 shortcodes/toc.html
70.459µs 35.229µs 66.459µs 100 0 0 2 partials/cookie-consent.html
70.083µs 35.041µs 66.708µs 100 0 0 2 partials/adsense-script.html
69.666µs 1.786µs 23.5µs 100 95 37 39 partials/custom-script.html
62.749µs 31.374µs 59.416µs 100 0 0 2 partials/announcement-script.html
62.584µs 62.584µs 62.584µs 0 0 0 1 _internal/_default/sitemapindex.xml
59.669µs 1.612µs 23.542µs 100 100 37 37 partials/manifest
35.458µs 35.458µs 35.458µs 0 0 0 1 /css/style-lazy.css
10.208µs 10.208µs 10.208µs 0 0 0 1 /css/style.css
| ZH | EN
-------------------+----+-----
Pages | 36 | 36
Paginator pages | 0 | 0
Non-page files | 0 | 0
Static files | 2 | 2
Processed images | 48 | 0
Aliases | 2 | 1
Cleaned | 4 | 4
Total in 1052 ms
- 将 public 文件夹下所有内容通过 ftp 或者宝塔面板，上传到云服务器建立的 HTML 网站根目录即可。
