Gatsby精品文章

• 

  用Gatsby和Strapi創(chuàng)建一個(gè)靜態(tài)博客(翻譯和自己探索過程中的經(jīng)驗(yàn)總結(jié))

  用Gatsby和Strapi創(chuàng)建一個(gè)靜態(tài)博客(翻譯和自己探索過程中的經(jīng)驗(yàn)總結(jié)) 原文參閱: Building a static blog using Gatsby and Strapi或https://blog.strapi.io/buildi.... 本篇主要是對其精華內(nèi)容進(jìn)行翻譯, 以及實(shí)操過程中遇到的問題解決和探索. 一些具...

  lijy91 2019-06-26 17:32 評論0 收藏0
• 

  使用 Gatsby.js 搭建靜態(tài)博客 1 關(guān)鍵文件

  ...建過，不過使用 Hexo 一鍵生成的，其實(shí)當(dāng)時(shí)也有考慮過 Gatsby，不過這個(gè)框架搭建博客入門還是比較難的，前置知識點(diǎn)包括 react 和 graphQL。 這個(gè)系列的文章記錄的就是這個(gè)博客搭建中需要注意的點(diǎn)。 此博客使用 gatsby-starter-blog 作...

  mzlogin 2019-08-23 13:58 評論0 收藏0
• 

  Gatsby極速入門—安裝和博客搭建（0）

  1.安裝 yarn global add gatsby-cli 2.創(chuàng)建gatsby項(xiàng)目 gatsby new blog 3.開發(fā) gatsby develop 注意報(bào)錯(cuò)： error UNHANDLED EXCEPTION Error: no parsers registered for: 文件空格問題，最好不要用空格和中文。直接放在硬盤根目錄下就不會(huì)有問題。 打開http...

  qieangel2013 2019-08-23 17:21 評論0 收藏0
• 

  Gatsby極速入門—支持Markdown（1）

  1.安裝插件 我用Gatsby就是因?yàn)樗С諱arkdown.所以不墨跡，直接整Md支持。 yarn add gatsby-source-filesystem yarn add gatsby-transformer-remark 2.添加格式化文章 在src>pages下面,添加三篇文章，頭部格式如下： path : /blog/my-first-post date : 2019-05...

  RobinTang 2019-08-26 18:27 評論0 收藏0
• 

  Gatsby極速入門—添加上一頁下一頁功能（完結(jié)篇）

  1.調(diào)整gatsby-node 這個(gè)就簡單了,打開gatsby-node.js，增加代碼如下： const path = require(path); exports.createPages = ({ actions, graphql }) => { const { createPage } = actions const blogPostTemplate = path.resolve(`...

  youkede 2019-08-23 17:59 評論0 收藏0
• 

  AntdSite - 一個(gè)基于React.Js的靜態(tài)網(wǎng)站生成器

  ... Antdsite 是一個(gè)基于 React.js 的靜態(tài)網(wǎng)站生成器。 它是由Gatsby Js驅(qū)動(dòng)的 使用 Ant Design設(shè)計(jì)構(gòu)建， 并且它的配置項(xiàng)借鑒了Vuepress 由來 以前我是vuepress的用戶，在開發(fā) vue 組件中使用它來寫文檔感覺非常順手。 后來我開始研究上了 r...

  jlanglang 2019-08-26 10:34 評論0 收藏0
• 

  創(chuàng)造屬于自己的靜態(tài)博客

  ...ttps://ssshooter.com/2019-02... 0 前言 本文并不是從 0 開始使用 gatsby.js 搭建博客，starter 使用的是 gatsby-starter-blog。使用 gatsby-starter-blog 可以大量節(jié)省項(xiàng)目搭建時(shí)間，直接得到一個(gè)最簡單的博客模版，這個(gè)模板的缺點(diǎn)是功能少，但是反...

  Channe 2019-08-23 15:05 評論0 收藏0
• 

  Gatsby極速入門—添加博客內(nèi)容頁（4）

  1.查數(shù)據(jù) 注意，這里跟前面不一樣了，我用gatsby-node.js這個(gè)文件去提供數(shù)據(jù)，沒有什么為什么，規(guī)定，照做就好。 const path = require(path); exports.createPages = ({ actions, graphql }) => { const { createPage } = actions const blogPostTemplate =...

  wean 2019-08-23 17:51 評論0 收藏0
• 

  使用 Gatsby.js 搭建靜態(tài)博客 4 標(biāo)簽系統(tǒng)

  原文鏈接：https://ssshooter.com/2018-12... 回顧：使用 Gatsby.js 搭建靜態(tài)博客 3 樣式調(diào)整 官方自帶標(biāo)簽系統(tǒng)教程，英語過關(guān)可以直接閱讀官方教程。 以下說一下重點(diǎn)： 提示：以下所有查詢都可以在 localhost:8000/___graphql 測試 建立標(biāo)...

  AndroidTraveler 2019-08-23 14:23 評論0 收藏0
• 

  Gatsby極速入門—添加博客文章列表（3）

  ...t import Header from ../components/header import { Link,graphql } from gatsby const Layout = ({ data }) => { const { edges } = data.allMarkdownRemark; return ( { ...

  cnTomato 2019-08-26 13:55 評論0 收藏0
• 

  Gatsby極速入門—使用GraphQL解析Markdown（2）

  ... src>components>Header.js里面， import { StaticQuery, graphql } from gatsby import React from react const TitleAndDescription = ({ data }) => { //這里的數(shù)據(jù)是下面查出來的 const title = data.site.siteMetadata.ti...

  fou7 2019-08-26 13:48 評論0 收藏0
• 

  使用 Gatsby.js 搭建靜態(tài)博客 3 樣式調(diào)整

  原文鏈接：https://ssshooter.com/2018-12... 回顧：使用 Gatsby.js 搭建靜態(tài)博客 2 實(shí)現(xiàn)分頁 修復(fù)代碼高亮 為了測試樣式，隨便找一個(gè)以前的 .md 文件粘貼到 blog 項(xiàng)目中渲染看看效果： emmm，問題大了，必備的代碼高亮都沒有... 但是當(dāng)...

  Julylovin 2019-08-23 14:04 評論0 收藏0
• 

  使用 Gatsby.js 搭建靜態(tài)博客 2 實(shí)現(xiàn)分頁

  原文地址：https://ssshooter.com/2018-12... 使用 Gatsby.js 搭建靜態(tài)博客 1 關(guān)鍵文件 0 && ( ← 上一頁 )} {currentPage + 1 { createPage({ path: i === 0 ? `/blog` : `/blog/${i + 1}`, componen...

  william 2019-08-23 13:59 評論0 收藏0
• 

  使用 Gatsby.js 搭建靜態(tài)博客 EX 使用語雀發(fā)布到博客

  ...很方便，實(shí)現(xiàn)過程也很有意思。同樣的原理可以運(yùn)用到 Gatsby.js 博客上。 因?yàn)槭褂昧?netlify，自動(dòng)部署的事情就不用自己擔(dān)心了，本文講述的有一下兩點(diǎn)： 熟悉語雀 webhook 使用 GitHub api 更新 GitHub 倉庫（更新倉庫后 netlify 自動(dòng)部...

  DoINsiSt 2019-08-23 14:47 評論0 收藏0