I. 前提条件

1.1 安装 Hugo

1.1.1 Windows

1.下载 Hugo(建议下载扩展版):Hugo(github.com)

2.解压 Hugo 压缩包到指定目录。

3.【Win + R】打开运行框,输入以下命令打开”系统属性“对话框:

sysdm.cpl

依次打开 "高级" -> 环境变量 -> 系统变量,在 Path 变量中点新建,添加 Hugo 解压目录如:

D:\Portable\Hugo

1.1.2 MacOS

brew install hugo

1.1.3 Linux

官方文档:Linux | Hugo (gohugo.io)

1.2 安装 Git

Git - Installing Git (git-scm.com)

II. 创建站点

2.1 安装确认

确认已安装 Hugo v0.112.0 或更高版本,在 Git Bash 下执行以下命令:

hugo version

2.2 创建站点

  1. 在本地选择合适的站点存放路径。
  2. 在 Git Bash 中执行以下命令为站点创建目录结构
hugo new site blog

2.3 创建源码仓库

  1. 登录 GitHub 仪表板。
  2. 创建仓库并命名,如:blog
  3. ⨀ Private(设置为私有仓库)

2.4 关联源码仓库

cd blog
git init -b main
git remote add origin git@github.com:user/repo.git
git pull --rebase origin main
git add .
git commit -m "Initial commit"
git branch -M main
git push -u origin main

2.5 主题配置

2.5.1 主题下载

可从 Hugo Themes 官方,或根据 awesome-hugo-themes 的 GitHub Stars 数量排行下载自己喜欢的主题,本教程使用 Hugo NexT 主题“双子座 (Gemini)”页面。

cd blog
mv hugo.toml hugo.toml.bak
git submodule add https://github.com/hugo-next/hugo-theme-next.git themes/hugo-theme-next
git submodule update --init --recursive
cp themes/hugo-theme-next/exampleSite/config.yaml .

提示:

下载 github 子模块你可能需要配置下载代理(请替换 port)

git config http.proxy http://127.0.0.1:<port>

让 Git 在执行 git clonegit pull 时自动更新子模块:

git config --global submodule.recurse true

配置说明:

这个命令会将 submodule.recurse 设置为全局配置,这意味着它会影响到所有使用该 Git 配置的仓库。你也可以在父仓库的 .git/config 文件中设置,使其只对该仓库生效。

2.5.2 主题配置

编辑 blog/config.yaml 站点配置文件,以下是当前版本(v4.6.3)参考配置:

1.站点基础配置,根据个人需求修改

# ---------------------------------------------------------------
# Hugo 引擎的基础配置
# Basic configure for Hugo engine
# ---------------------------------------------------------------
# 站点域名,比如: https://hugo-next.eu.org
# Website domain, eg: https://hugo-next.eu.org
baseURL: https://blog.example.com
# 站点标题
# Website title
title: 小明的博客
......
#-----------------------------------------
# Hugo NexT 主题参数配置
# Configure Settings for Hugo NexT theme
#-----------------------------------------
params:
......
# 站点基本信息
# Site Information Settings
author: 博客作者
subtitle: 一个有趣的博客小站
description: 在这里记录我的喜怒哀乐。
keywords: IT,前端,后端,Android,IOS,Web
# 不同尺寸站点图标
# Different size of favicon
favicon:
icon: /imgs/icons/favicon.ico
small: /imgs/icons/favicon_16x16_next.png
medium: /imgs/icons/favicon_32_32_next.png
appleTouchIcon: /imgs/icons/apple_touch_icon_next.png

配置说明:

blog/static/imgs/icons/ 目录上传自定义站点图标(Discussion #38)。

2.参考主题示例站点,创建相关目录和文件(Discussion #47

cp themes/hugo-theme-next/exampleSite/content/about.md content/
cp themes/hugo-theme-next/exampleSite/content/flinks.md content/
cp -r themes/hugo-theme-next/exampleSite/content/archives/_index.md content/archives/
mkdir content/knowledge
mkdir content/lives

3.根据个人需求增删菜单,自定义菜单显示顺序

menus:
main:
- identifier: home
name: 首页
pageref: /
pre: home
weight: 1
- identifier: about
name: 关于
pageref: /about.html
pre: user
weight: 2
- identifier: knowledge
name: 知识
pageref: /knowledge
pre: book
weight: 3
- identifier: lives
name: 生活
pageref: /lives
pre: sun
weight: 4
# - identifier: flinks
# name: 站点示例
# pageref: /flinks.html
# pre: thumbs-up
# weight: 3
# - identifier: archives
# name: 归档
# pageref: /archives
# pre: archive
# weight: 5
- identifier: commonweal
name: 公益
url: /404.html
pre: heartbeat
weight: 5

如果同时想更换菜单图标,在 Font Awesome 网站 Icons 菜单中搜索如: knowledge ,从 VUE 的 “Default Style” 中提取如下参数 bookDiscussion #88),然后在上面自定义菜单中更新参数 pre: book

<font-awesome-icon icon="book" />

增删菜单项后,还需配置文章存放目录以在主页显示文章(Discussion #98

params:
# 需要显示文章的部分,即content目录下的文件夹名称
# Sections for show in home & archive page
# and it's forlder name which under content
mainSections: ["knowledge", "lives"]
......

4.Hugo Next 主题默认文章目录显示会自动设置列表数字,如果文章标题有自定义序号,会重复显示标题序号,修改如下

# 文章目录显示
# Table of Contents in the Sidebar
# Front-matter variable (nonsupport wrap expand_all).
toc:
enable: true
# 自动设置列表的数字
# Automatically add list number to toc.
number: false

5.根据个人需求增删社交链接

#socials:
social0: Github || https://github.com/elkan1788 || fab fa-github
#social1: E-Mail || mailto:yourname@gmail.com || fa fa-envelope
social2: 知乎 || https://www.zhihu.com/people/lisenhui || fa fa-book
#Google: https://plus.google.com/yourname || fab fa-google
......
# links:
# link0: Hugo-NexT || https://gitee.com/hugo-next/hugo-theme-next
# link1: 凡梦星尘空间站 || https://lisenhui.cn

6.根据实际需求增删备案和供应商

# 国内 ICP 备案和公安网备信息
# Beian ICP and gongan information for Chinese users.
# See: https://beian.miit.gov.cn, http://www.beian.gov.cn
beian:
enable: false
......
# 站点支持供应商列表
# Vendors list who support website.
vendors:
enable: false

7.使用 Waline 做文章统计和评论统计(需先开启 Waline 评论组件,参考本教程 5.1.1 章节)

# 是否开启评论数显示
comments:
enable: true
# 评论统计插件,暂只支持waline
# Comment counter plugin, only support waline
plugin: waline
# 是否开启页面访问数显示
views:
enable: true
# 页面访问统计插件,支持busuanzi, waline, leancloud
# Page views counter plugin, support: busuanzi, waline, leancloud
plugin: waline

8.根据个人需求{开启|关闭}捐赠

# 捐赠信息设置
# Donate (Sponsor) settings.
rewardSets:
# 是否开启捐赠按钮,开启后将在每个文章页面底部显示
# If true, a donate button will be displayed
# in every article by default.
enable: false
......

9.根据个人需求{开启|关闭}其它订阅站点

# followMe:
#channel0: Twitter || https://twitter.com/username || fab fa-twitter
#channel1: Telegram || https://t.me/channel_name || fab fa-telegram
channel2: WeChat || /images/wechat_channel.jpg || fab fa-weixin
channel3: RSS || /atom.xml || fa fa-rss
......

10.根据个人需求{开启|关闭}在线编辑功能

# 文章的在线编辑
# Post edit
# Easily browse and edit blog source code online.
postEdit:
enable: false
url: https://github.com/user-name/repo-name/tree/branch-name/subdirectory-name/

11.根据个人需求{开启|关闭}右上角在 Github 上面关注我的横幅

# 右上角在 Github 上面关注我的横幅
# `Follow me on GitHub` banner in the top-right corner.
githubBanner:
# 是否开启显示
# If true, will display banner.
enable: false
......

12.根据个人需求{开启|关闭}评论组件

# 评论组件设置,最多支持2个显示
# Multiple Comment System Support
comments:
# 开启评论组件
# If true, will show comment component in post end.
enable: false

13.使用 51LA 作站点统计(需注册账号)

siteState:
# 是否在侧边栏显示文章、分类、标签信息
# Posts / Categories / Tags in sidebar.
basic: true
# 站点访问信息
# Site's view information
views:
enable: true
# 组件类型,可选值为: 51la, busuanzi
# 使用51la时需要注册账号:https://invite.51.la/
# Plguin value is: 51la, busuanzi
plugin: 51la ...... analytics:
# 51La 站点统计
# 更多信息请参考:https://invite.51.la/1NUfGTS1?target=V6
# 51La Analytics
# See: https://invite.51.la/1NUfGTS1?target=V6
laId: 123456789ABCDEFG
# 百度统计
# Baidu Analytics
#baidu: #<anaytics_id>
# 谷歌统计
# Google Analytics
#google: #<anaytics_id>
# 不蒜子统计
# Show Views / Visitors of the website / page with busuanzi.
# For more information: http://ibruce.info/2015/04/04/busuanzi/
# busuanzi:
# visitorsIcon: fa fa-user
# viewsIcon: fa fa-eye

14.把侧边栏“日志”改为“文章”(可选)

cp themes/hugo-theme-next/i18n/zh-cn.yaml i18n/

i18n/zh-cn.yamlposts: 日志改为

Sidebar:
label:
posts: 文章

把“目前共计……日志”改为

Terms:
archives: "目前共计 <strong>{{ .Count }}</strong> 篇文章"

15.去掉文章正文中 3 级4 级标题下方横线(可选)

需开启“用户自定义文件配置”,如下:

# 用户自定义文件配置
# Define custom file paths.
customFilePath:
# sidebar: custom_sidebar.html
# footer: custom_footer.html
style: /css/custom_style.css

static/css/custom_style.css 添加以下内容

.post-body h1,.post-body h2 {
border-bottom: 1px solid #eee
} .post-body h3,.post-body h4 {
border-bottom: 0px dotted #eee
}

III. 创建文章

3.1 配置文章模板

修改 blog\archetypes\default.md 中的参数,把 draft = true (表示这是一个草稿) 修改为 draft = false ,这样生成的文章默认就是可以发表的。

3.2 发布文章

3.2.1 创建文章

hugo new posts/knowledge/hello-world.md

3.2.2 增加前置格式

使用 Front matter 为 Hugo 文章添加元数据。以下为示例配置:

+++
title = "Hugo 静态博客部署"
slug = "hugo-static-blog-deployment"
categories = ["blog"]
tags = ["hugo"]
draft = false
date = 2024-06-21T17:17:32+08:00
lastmod = 2024-06-21T17:35:13+08:00
+++

参数说明:

  • Taxonomies -- Hugo 支持用户自定义分类法的功能(官方文档:Taxonomies)。
  • slug -- 将 slug 中的内容替换掉文章 URL 最后一段中文。标签值不会影响章节页面。

3.3 生成网页

通过以下命令在本地实时预览当前编辑内容:

hugo server -D

通过终端中显示的 URL 查看博客。按 Ctrl + C 停止 Hugo 的开发服务器。

3.4 发布内容

hugo 命令可以将你写的 Markdown 文件生成静态 HTML 网页,生成的 HTML 文件默认存放在站点路径下的 public 目录中。

hugo

IV. 自动部署

4.1 GitHub Page 部署

4.1.1 创建 GitHub Pages

  1. 登录 GitHub 仪表板。
  2. 创建仓库并命名:<username>.github.io (username 必须是当前登录 GitHub 用户名)。
  3. ⨀ Public(设置为公开仓库)。

4.1.2 生成 API 令牌

从博客源码仓库(以下简称 “仓库1”)推送到外部 GitHub Pages 仓库(以下简称 “仓库2”),需要特定权限,所以还得在 GitHub 账户 Setting -> Developer settings -> Personal access tokens -> Tokens (Classic) -> Generate new token (classic) 创建一个 Token:

  1. 给 Token 备注一个名称,如:Token for Pages
  2. 到期时间:No expiration(永不过期)
  3. 范围选择:repoworkflow
  4. 生成令牌(Generate token)

4.1.3 配置环境变量

进入博客源码仓库的 Settings:

  1. 选择 “Secrets and variables” 下的 “Actions”,在 “Secrets” 选项卡中选择 “New repository secret” 项。
  2. 在 “Name” 中填入 PERSONAL_TOKEN,在 "Secret" 中填入前面生成的 token,点击 ”Add secret“ 保存。

4.1.4 创建工作流

返回源码仓库点击 “Actions” 按钮,搜索工作流 hugo ,找到后点击 “Configure”,修改后的配置内容如下(更详细用法参考 GitHub Pages action):

# Sample workflow for building and deploying a Hugo site to Github Pages
name: Deploy Hugo site to Pages on:
# 当这个项目仓库发生推送动作后,执行 GitHub Action
push:
branches: ["main"]
# 可以在 GitHub 项目仓库的 Action 工具栏进行手动调用
workflow_dispatch: jobs:
build:
runs-on: ubuntu-latest
steps:
- name: Checkout
uses: actions/checkout@v4.1.7
with:
submodules: true
fetch-depth: 0 - name: Setup Hugo
uses: peaceiris/actions-hugo@v3
with:
hugo-version: "latest"
# 按需选择是否使用 hugo-extended
extended: true - name: Build Web
run: hugo - name: Deploy Web
uses: peaceiris/actions-gh-pages@v4
with:
# 生成的 token 就用在这里,因为下面用到 external repository
PERSONAL_TOKEN: ${{ secrets.PERSONAL_TOKEN }}
# 修改为你的 Github Pages 仓库
EXTERNAL_REPOSITORY: user/user.github.io
# 以及对应的分支 main/master
PUBLISH_BRANCH: main
# 指定将自动部署得到的 public 文件夹 push 上去
PUBLISH_DIR: ./public
commit_message: ${{ github.event.head_commit.message }}

4.1.5 推送更新

现在,可以在博客源码仓库中推送一片 .md 文章,GitHub Pages 仓库将同步更新,然后可以浏览 <username>.github.io (请替换为你的 URL)验证站点访问。

4.1.6 (可选)自定义域名

如果你使用了自定义域名,仅在 Github Pages 仓库的设置里配置域名是无效的,因为每次部署都会覆盖那里的设置。你需要通过 cname 指定:

- name: Deploy Web
uses: peaceiris/actions-gh-pages@v4
with:
# 生成的 token 就用在这里,因为下面用到 external repository
PERSONAL_TOKEN: ${{ secrets.PERSONAL_TOKEN }}
# 修改为你的 Github Pages 仓库
EXTERNAL_REPOSITORY: user/user.github.io
# 以及对应的分支 main/master
PUBLISH_BRANCH: main
# 指定将自动部署得到的 public 文件夹 push 上去
PUBLISH_DIR: ./public
# 自定义域名
cname: custom.domain.com
# 提交信息
commit_message: ${{ github.event.head_commit.message }}

4.2 Cloudflare Pages 部署

Cloudflare Pages 更多集成部署请参考:Use Direct Upload with continuous integration

4.2.1 创建 Cloudflare Pages

  1. 登录 Cloudflare 仪表板。
  2. 在 “Workers 和 Pages” 菜单 -> Pages 中,“使用直接上传创建” -> 上传资产。为项目创建名称,如:blog

4.2.2 生成 API 令牌

要生成 API 令牌:

  1. 登录 Cloudflare 仪表板。
  2. 从仪表板右上角用户图标的下拉菜单中选择“我的个人资料”。
  3. 选择 API 令牌 > 创建令牌。
  4. 在“自定义令牌”下,选择“开始使用”。参考如下配置:

  1. 选择“继续显示摘要” > 创建令牌。

4.2.3 获取账户 ID

要查找您的账户 ID,请登录 Cloudflare 仪表板 > 在账户主页中选择您的区域 > 在右侧菜单 API 下的概览中查找您的账户 ID。如果您尚未添加区域,请通过选择“添加站点”来添加区域。您可以从 Cloudflare 的注册商处购买域名。

4.2.4 配置环境变量

进入 GitHub 博客源码仓库的 Settings:

  1. 选择 “Secrets and variables” 下的 “Actions”,在 “Secrets” 选项卡中选择 “New repository secret” 项。
  2. 在 “Name” 中填入 CLOUDFLARE_API_TOKEN,在 "Secret" 中填入 4.2.2 章节生成的 API Token ,点击 ”Add secret“ 保存。
  3. 以同样的方法创建 CLOUDFLARE_ACCOUNT_ID ,填入 4.2.3 章节获取的账户 ID 。

4.2.5 创建工作流

返回 GitHub 源码仓库点击 “Actions” 按钮,搜索工作流 hugo ,找到后点击 “Configure”,将 YOUR_PROJECT_NAME 替换为你的 Cloudflare Pages 项目名称。修改后的配置内容如下(更详细用法参考 Cloudflare Pages GitHub Action):

# Sample workflow for building and deploying a Hugo site to Cloudflare Pages
name: Deploy Hugo site to Cloudflare Pages on:
# 当这个项目仓库发生推送动作后,执行 GitHub Action
push:
branches: ["main"]
# 可以在 GitHub 项目仓库的 Action 工具栏进行手动调用
workflow_dispatch: jobs:
publish:
runs-on: ubuntu-latest
permissions:
contents: read
deployments: write
name: Publish to Cloudflare Pages
steps:
- name: Checkout
uses: actions/checkout@v4 # Run a build step here if your project requires - name: Publish to Cloudflare Pages
uses: cloudflare/pages-action@v1.5
with:
apiToken: ${{ secrets.CLOUDFLARE_API_TOKEN }}
accountId: ${{ secrets.CLOUDFLARE_ACCOUNT_ID }}
# Cloudflare Pages projects name
projectName: YOUR_PROJECT_NAME
# Publish directory
directory: ./public
# Optional: Enable this if you want to have GitHub Deployments triggered
# gitHubToken: ${{ secrets.GITHUB_TOKEN }}
# Optional: Switch what branch you are publishing to.
# By default this will be the branch which triggered this workflow
branch: main
# Optional: Change the working directory
# workingDirectory: my-site
# Optional: Change the Wrangler version, allows you to point to a specific version or a tag such as `beta`
wranglerVersion: '3'

4.2.6 推送更新

现在,可以在博客源码仓库中推送一片 .md 文章,GitHub Action 将自动把 public 目录下的 html 文件推送至 Pages 项目目录,然后可以浏览 Cloudflare Pages 为您提供的默认域名,如 blog.pages.dev (请替换为你的 URL)验证站点访问。

4.3 服务器部署

4.3.1 服务器准备

  1. 在远程服务器上创建站点存放目录。如:/var/www/blog/
  2. 在服务器上安装 rsync 工具。
  3. 服务器安全考虑,建议修改 SSH 远程连接端口(默认: 22)。
  4. SSH 用户准备,非 root 用户注意须赋予对站点目录读写权限。
  5. 为 SSH 用户生成密钥对,公钥部分应添加到服务器上的 authorized_keys 文件中。

4.3.2 Nginx 部署

  1. 根据服务器 OS 不同安装对应版本 nginx 应用。
  2. 若需要配置域名 SSL 证书,建议通过 acme.sh (github.com) 部署。

4.3.3 配置环境变量

进入博客源码仓库的 Settings:

  1. 选择 “Secrets and variables” 下的 “Actions”,在 “Secrets” 选项卡中选择 “New repository secret” 项。
  2. 为工作流中 remote_hostremote_portremote_userremote_path 等参数创建额外的 secret 。

4.3.4 创建工作流

在源码仓库点击 “Actions” 按钮,搜索工作流 hugo ,找到后点击 “Configure”,修改后的配置内容如下(更详细用法参考 Rsync Deployments Action):

# Sample workflow for building and deploying a Hugo site to Server
name: Deploy Hugo site to Server on:
# 当这个项目仓库发生推送动作后,执行 GitHub Action
push:
branches: ["main"]
# 可以在 GitHub 项目仓库的 Action 工具栏进行手动调用
workflow_dispatch: jobs:
build:
runs-on: ubuntu-latest
steps:
- name: Checkout
uses: actions/checkout@v4.1.7
with:
submodules: true
fetch-depth: 0 - name: Setup Hugo
uses: peaceiris/actions-hugo@v3
with:
hugo-version: "latest"
# 按需选择是否使用 hugo-extended
extended: true - name: Build Web
run: hugo - name: Rsync Deployments
uses: burnett01/rsync-deployments@7.0.1
with:
# rsync 同步选项
switches: -avzr --delete
# 本地仓库同步目录
path: ./public/*
# 远程仓库同步目录
remote_path: ${{ secrets.DEPLOY_PATH }}
# 远程服务器域名或IP
remote_host: ${{ secrets.DEPLOY_HOST }}
# 远程服务器端口
remote_port: ${{ secrets.DEPLOY_PORT }}
# 远程服务器用户
remote_user: ${{ secrets.DEPLOY_USER }}
# 远程服务器用户私钥
remote_key: ${{ secrets.DEPLOY_KEY }}
# 远程服务器用户私钥密码
remote_key_pass: ${{ secrets.DEPLOY_KEY_PASS }}

4.3.5 推送更新

现在,可以在博客源码仓库中推送一片 .md 文章,GitHub Action 将自动把 public 目录下的 html 文件推送至远程服务器 /var/www/blog/ 站点目录,然后可以浏览你的远程服务器域名,如 blog.example.com (请替换为你的 URL)验证站点访问。

V. 博客维护

5.1 开启评论组件(可选)

5.1.1 Waline

详细配置信息请参考: Waline

使用 Cloudflare CNAME 代理访问评论系统,Web 页面可能会出现重定向次数过多问题,请参考本教程 5.4.2 章节解决。

5.1.2 Giscus

详细配置信息请参考: giscus

5.2 升级主题

手动升级主题时,在站点目录下执行以下命令:

cd blog
git submodule update --remote

5.3 Hugo 常用命令

5.3.1 清除缓存

在开发环境中,有时缓存可能会导致问题。尝试清除 Hugo 缓存并重新生成站点:

hugo --cleanDestinationDir

5.3.2 调试日志

检查 Hugo 构建时的日志,看看是否有任何错误或警告信息:

hugo server -v

5.4 常见问题

5.4.1 新手问题

如果你是初次建站的话,可以使用 Github 的模板功能,一键生成你的站点仓库代码。访问 hugo-theme-next-starter 点击右上角的 Use this template 绿色按钮然后填写代码仓库的相关信息,详细参考 Hugo NexT 主题 README ,完成后克隆到本地测试,再根据个人喜好创建个性化配置。

5.4.2 重定向次数过多

参考文档:访问后台出现重定向次数过多该怎么办 | CSDN

原因

Cloudflare 开启 SSL 证书后默认是灵活 SSL,仅在访问者与 Cloudflare 之间启用加密。这可以避免浏览器发出安全警告,但 Cloudflare 与您的源服务器之间的所有连接均通过 HTTP 建立。

解决方法

对于采用 Cloudflare 提供的 CDN 加速来说,将“灵活” SSL 切换到“完全” SSL。

VI. 参考文档

中文文档:Hugo 中文文档 (opendocs.io)

英文文档:Hugo Documentation | Hugo (gohugo.io)

Hugo NexT 主题:hugo-next/hugo-theme-next(github.com)

Hugo 静态博客部署的更多相关文章

  1. 用hugo建博客的记录 · 老张不服老

    前后累计折腾近6个小时,总算把搭建hugo静态博客的整个过程搞清楚了.为什么用了这么久?主要还是想偷懒,不喜欢读英文说明.那就用中文记录一下过程吧.还是中文顺眼啊. 某日发现自己有展示些东西给外网的需 ...

  2. Note | 用Hugo搭建博客并部署到GitHub Pages

    目录 1. 本地搭建 1.1 安装Hugo 1.2 创建站点 1.3 新建页面和文章 1.4 使用主题 1.5 修改配置文件 1.6 预览 2. 部署 之前担心过现有博客平台(如博客园,CSDN)突然 ...

  3. hexo部署到gitcafe上静态博客

    http://zanderzhang.gitcafe.io/2015/09/17/hexo部署到gitcafe上静态博客/ hexo这些事儿,zippera's blog,之类的,这些都说的很清楚了. ...

  4. Hexo快速搭建静态博客并实现远程VPS自动部署

    这篇文章将如何搭建hexo,以及如何通过git webhooks实现远程vps的自动部署 这篇文件适合的条件: 简单的用于个人博客.公司博客展示,hexo的定位是静态博客,要实现动态服务器的功能并不适 ...

  5. Hexo搭建静态博客踩坑日记(一)

    前言 博客折腾一次就好, 找一个适合自己的博客平台, 专注于内容进行提升. 方式一: 自己买服务器, 域名, 写前端, 后端(前后分离最折腾, 不分离还好一点)... 方式二: 利用Hexo, Hug ...

  6. 如何用hugo 搭建博客

    1,Hugo 简介 搭建个人博客有很多开源的博客框架,我们要介绍的框架叫作Hugo.Hugo 是一个基于Go 语言的框架,可以快速方便的创建自己的博客. Hugo 支持Markdown 语法,我们可以 ...

  7. Github Pages和Hexo创建静态博客网站

    Github Pages和Hexo创建静态博客网站 安装Node.js 本人是window环境,所以下载window版. 下载地址:https://nodejs.org/en/download/ 下载 ...

  8. Hexo静态博客搭建教程

    Hexo是一个快速.简洁且高效的博客框架.Hexo 使用 Markdown(或其他渲染引擎)解析文章,在几秒内,即可利用靓丽的主题生成静态网页.生成静态网页可以托管在github.下面简单介绍一下he ...

  9. 用GitHub Pages搭了个静态博客

    经过周末两天折腾,终于在GitHub Pages上用Hugo搭了个静态博客. 链接:https://xusiwei.github.io/ @ruanyf 曾经在博客里提到过"喜欢写Blog的 ...

  10. 【一】Ubuntu14.04+Jekyll+Github Pages搭建静态博客

    本系列有五篇:分别是 [一]Ubuntu14.04+Jekyll+Github Pages搭建静态博客:主要是安装方面 [二]jekyll 的使用 :主要是jekyll的配置 [三]Markdown+ ...

随机推荐

  1. T3 出行云原生容器化平台实践

    公司简介 T3 出行是南京领行科技股份有限公司打造的智慧出行生态平台,由中国第一汽车集团有限公司.东风汽车集团有限公司.重庆长安汽车股份有限公司发起,联合腾讯.阿里巴巴等互联网企业共同投资打造.公司以 ...

  2. Vue 实现 PDF 导出功能

    旨在通过 html2canvas 和 jspdf,先将页面的 html 转成 canvas,再将 canvas 转成 pdf,同时解决了分页截断的问题. 安装依赖 yarn add html2canv ...

  3. HTB打靶记录-Infiltrator

    nmap scan nmap -A 10.10.11.31 Starting Nmap 7.94SVN ( https://nmap.org ) at 2024-10-15 13:18 CST Nma ...

  4. MIT 6.002 Circuits and Electronics by Prof. Anant Agarwal

    官网:MIT 2007 Circuits and Electronics 参考资料,课程讲义,课程PPT. 国内的电路像石群老师,罗先觉老师,讲的很细致,也许跟教材有关系,像电阻串并联的等效电阻就用了 ...

  5. Bootstrap 栅栏布局中 col-xs-*、col-sm-*、col-md-*、col-lg-* 区别及使用方法 _2021-11-10

    Bootstrap 栅栏布局中 col-xs-.col-sm-.col-md-.col-lg- 区别及使用方法 全文转自:https://www.cnblogs.com/tangbohu2008/p/ ...

  6. DOS下的网络管理命令

    DOS下的网络管理命令 一. 实验目的 掌握DOS下的网络管理命令 二. 实验内容和要求 在DOS环境下用不同的网络管理命令,实现不同的网络管理功能 三. 实验方法.步骤及结果测试 1.  原理分析及 ...

  7. python bytecode解析

    python bytecode解析 前言 我们的电脑是怎么运行的呢?计算机内部的 CPU 处理器是个硅片,上面雕刻着精心布置的电路,输入特定的电流,就能得到另一种模式的电流,而且模式可以预测,给这些模 ...

  8. vim粘贴文件格式不乱

    vim粘贴防止格式乱,配置以下命令然后在粘贴,即可~ :set paste

  9. J2eefast页面调试状态下自动进入debugger断点

    将fastJS.min.js 替换为 fastJs.js 将所使用到的模块的min.js 替换为js文件

  10. .NET Core 特性(Attribute)底层原理浅谈

    简介 烂大街的资料不再赘述,简单来说就是给代码看的注释 Attribute的使用场景 Attribute不仅仅局限于C#中,在整个.NET框架中都提供了非常大的拓展点,任何地方都有Attribute的 ...