1

一个 Gatsby 博客模板

 2 years ago
source link: https://inote.xyz/gatsby-starter-glass/
Go to the source link to view the article. You can view the picture content, updated content and better typesetting reading experience. If the link is broken, please click the button below to view the snapshot at that time.
neoserver,ios ssh client

一个 Gatsby 博客模板

技能 • Dec 1, 2021 • 8

一个利用 Gatsby 搭建静态网站的模板。

源码在 gatsby-starter-glass,欢迎试用。

  • 包含 Waline 评论
  • 包含谷歌分析
  • Markdown 编辑
# 1. Clone 到本地
git clone https://github.com/xiyizhou/gatsby-starter-glass.git

# 2. cd 到目录
cd gatsby-starter-glass

# 3. 安装依赖
yarn install

# 4. 启动开发模式
yarn start

# 5. 构建生产版本
yarn  build
  • gatsby-config.js 中配置网站信息,Google 分析 ID 等。

  • src/components/header.js 中配置顶部导航栏信息。

  • src/components/footer.js 中配置底部导航栏信息。

  • src/components/comment.js 中配置 Waline 信息。

博客文章位于 content/blog。模板如下:

---
title: 为 Gatsby 安装 Waline 评论组件
date: 2021-11-17 08:08
slug: gatsby-waline
category: 生活
tags:
  - 生活
description: 由于 Waline 还没有 Gatsby 组件,通过安装 Waline 客户端库,创建 React 组件,并在合适的位置引入组件,在 gatsby 站点上添加 waline 评论功能。
---

Gatsby 是基于  reac t的静态网站构建框架,可以用来部署网上商城、官网和博客,利用丰富的插件可以实现图片懒加载、Markdown 文档支持、访客评论等功能。Gatsby 官方推荐的评论系统有 Disqus、Gitalk 等。

页面内容位于 content/pages


About Joyk


Aggregate valuable and interesting links.
Joyk means Joy of geeK