前言
在 《一篇帶你用 VuePress + Github Pages 搭建部落格》中，我們使用 VuePress 搭建了一個部落格，最終的效果檢視：TypeScript 中文文檔。
本篇講講如何進行 SEO 優化。
1. 生成 sitemap
借助 vuepress-plugin-sitemap 生成站點地圖：
1.1 安裝
yarn add vuepress-plugin-sitemap -D
1.2 修改 config.js
// .vuepress/config.js
module.exports = {
plugins: {
'sitemap': {
hostname: 'https://ts.yayujs.com'
},
}
}
1.3 如果生成失敗
如果 build 的時候，生成失敗：
這可能是因為你設定了
lastUpdated
或者使用了
@vuepress/last-updated
插件，當兩個一起用的時候，因為時間對象的緣故，産生了報錯，我們搜尋 vuepress-plugin-sitemap 的 issues，可以找到一個解決方法，我們修改一下 config.js：
// .vuepress/config.js
module.exports = {
plugins: [
[
'@vuepress/last-updated',
{
transformer: (timestamp, lang) => {
return new Date(timestamp).toLocaleDateString();
}
}
],
[
'sitemap',
{
hostname: 'https://ts.yayujs.com'
}
]
]
}
1.4 build 成功
如果 build 成功，我們則會在 dist 目錄裡看到一個 sitemap.xml，大緻類似于這種結構：
<?xml version="1.0" encoding="utf-8"?>
<urlset xmlns="http://www.sitemaps.org/schemas/sitemap/0.9" xmlns:news="http://www.google.com/schemas/sitemap-news/0.9" xmlns:xhtml="http://www.w3.org/1999/xhtml" xmlns:mobile="http://www.google.com/schemas/sitemap-mobile/1.0" xmlns:image="http://www.google.com/schemas/sitemap-image/1.1" xmlns:video="http://www.google.com/schemas/sitemap-video/1.1">
<url>
<loc>https://ts.yayujs.com/learn-typescript/</loc>
<lastmod>2022-01-05T16:00:00.000Z</lastmod>
<changefreq>daily</changefreq>
</url>
<url>
<loc>https://ts.yayujs.com/learn-typescript/handbook/ConditionalTypes.html</loc>
<lastmod>2022-01-05T16:00:00.000Z</lastmod>
<changefreq>daily</changefreq>
</url>
</urlset>
1.5 sitemap 位址
我們部署到伺服器上，就可以獲得一個 sitemap 位址，比如我的就是：
https://ts.yayujs.com/learn-typescript/sitemap.xml
有了這樣一個 sitemap 位址，我們可以友善的送出給各個搜尋引擎平台，友善根據 sitemap 抓取我們的頁面。
2. 百度收錄
2.1 添加站點
登陸百度搜尋資源平台，進入使用者中心：
點選「添加站點」，可能需要你完善下賬戶資訊，然後會進入站點資訊填寫頁面，分為三步：
第一步：輸入站點
第二步：站點屬性
第三步：驗證網站
之是以需要驗證網站，是為了證明你是該域名的擁有者，驗證成功後，可以快捷批量添加子站點，檢視所有子站資料，無需再一一驗證子站點。
這裡我采用的是 HTML 标簽驗證的方式，根據圖中的代碼訓示，修改 vuepress 的
config.js
檔案：
// config.js
module.exports = {
title: "title",
description: 'description',
head: [
['meta', { name: 'baidu-site-verification', content: '填寫自己的 code' }]
]
}
然後點選「完成驗證」，就會出現：
點選「我知道了」，就會跳轉到 HTTPS 認證這裡：
等待一天後，會顯示認證成功：
2.2 送出收錄
在站點管理頁面，點選「普通收錄」：
普通收錄工具可以向百度搜尋主動推送資源，縮短爬蟲發現網站連結的時間，不保證收錄和展現效果。
這裡提供了三種方式收錄：API 送出、sitemap、手動送出，那該如何選擇呢？參考平台工具使用手冊：
API推送：最為快速的送出方式，建議您将站點當天新産對外連結接立即通過此方式推送給百度，以保證新連結可以及時被百度收錄。
sitemap：您可以定期将網站連結放到Sitemap中，然後将Sitemap送出給百度。百度會周期性的抓取檢查您送出的Sitemap，對其中的連結進行處理，但收錄速度慢于API推送。
手動送出：如果您不想通過程式送出，那麼可以采用此種方式，手動将連結送出給百度。
這裡我選擇的是 sitemap 方式，填寫上節獲得的 sitemap 位址：
送出後，就會進入等待抓取狀态：
3. 谷歌收錄
3.1 添加站點
通路 search.google.com，如果你之前沒有添加過站點，會直接讓你添加站點：
3.2 DNS 驗證站點
這裡我選擇的是「網域」，輸入域名後，會讓你進行 DNS 驗證：
由于我是在萬網購買的域名，是以直接通路阿裡雲域名控制台，然後選擇對應的域名點選 「解析」：
然後點選「添加記錄」：
記錄類型選擇
TXT
，記錄值填寫 Google 提供的内容：
添加完後，由于 DNS 解析需要一段時間，最好等個幾分鐘後再進行驗證，驗證成功後會進入站點背景：
3.3 送出收錄
點選左側導航欄「網站檢查」，輸入要檢查的域名，如果沒有收錄到 Google 中，點選「請求編入索引」：
在測試完實際網址可否可編入索引後，就會出現：
3.4 送出站點地圖
3.5 确認收錄
可以在谷歌搜尋欄使用 site:域名, 來确認站點是否已被谷歌收錄
4. 360 收錄
4.1 添加站點
登陸 360 站長平台：
4.2 驗證站點
4.3 送出站點地圖
5. 其他平台
除了這三個平台之外，還有 Bing 站長、搜狗站長、神馬站長，操作基本類似，就不多說了。
系列文章
部落格搭建系列是我至今寫的唯一一個偏實戰的系列教程，預計 20 篇左右，講解如何使用 VuePress 搭建、優化部落格，并部署到 GitHub、Gitee、私有伺服器等平台。本篇為第 27 篇，全系列文章位址：https://github.com/mqyqingfeng/Blog
微信：「mqyqingfeng」，加我進冴羽唯一的讀者群。
如果有錯誤或者不嚴謹的地方，請務必給予指正，十分感謝。如果喜歡或者有所啟發，歡迎 star，對作者也是一種鼓勵。