config配置

config.js的位置
config.js的位置應該在.vuepress里面,它的配置主要包含了網(wǎng)站的標題、描述、主題的配置等。
貼一下我現(xiàn)在的config.js的配置

我的config配置
這里是config.js。所以開頭要寫
module.exports = {}包裹一下,在hugo中一般是config.json或者config.toml。官網(wǎng)上找到了這樣一段話:

config也可以是以上兩種格式的
base: 網(wǎng)站用來部署的基準 URL。如果你打算將你的網(wǎng)站部署到
https://foo.github.io/bar/,
則應將 base 設(shè)置為 "/bar/"。以/開始和結(jié)束。
在其他選項中,base 會自動添加到以 / 開頭的所有 URL 中,因此你只需指定一次即可。
title: 網(wǎng)站的標題,也是所有頁面標題的前綴,顯示在默認主題的導航欄中。
description: 網(wǎng)站描述,在頁面 HTML 中表現(xiàn)為一個 <meta> 標簽。
head: 被注入頁面 HTML <head> 額外的標簽。
每個標簽可以用 [tagName, { attrName: attrValue }, innerHTML?] 的形式指定。例如:
module.exports = {
head: [
['link', { rel: 'icon', href: '/logo.png' }] // 悄咪咪的說一下,路徑`/`就是public資源目錄
]
}
themeConfig: 為使用的主題提供配置選項。這些選項將根據(jù)你使用的主題而有所不同?!厩煤诎澹哼@點很重要】
serviceWorker: 如果設(shè)置為 true,VuePress 將自動生成并注冊一個 service worker ,
這個 worker 將內(nèi)容緩存以供離線使用(僅在生產(chǎn)環(huán)境中啟用)。這個是用來做PWA的,
不是很了解PWA的看這里 https://developer.mozilla.org/zh-CN/docs/Web/Manifest。
------------------------------我是鱷魚分割線---------------------
themeConfig下的
nav: 導航欄配置,此配置主要用于配置導航欄的鏈接,例如以上主頁的link為"/",默認是根目錄下的README.md。
"/web/"鏈接到根目錄docs下的web文件夾下的README.md文件。
sidebar: 側(cè)邊欄配置,你可以省略.md拓展名,同時以/結(jié)尾的路徑將會被視為 */README.md。
'/miniprogram/'、'/vue/'和'/web/'是通過路由的方式將每個頁面的標題抽取出來顯示。
"/miniprogram/"是指根目錄下miniprogram文件夾中的路由,每個路由鏈接都要有README.md
sidebarDepth: 側(cè)邊欄自動顯示當前激活頁面中標題的鏈接,嵌套在頁面本身的鏈接下。
默認深度是1,提取h2標題;0禁用標題鏈接;最大值為2,同時提取h2和h3。
【頁面中的front matter可以重新設(shè)置覆蓋config里的這個值】
lastUpdated: 最近更新,選項允許你獲取每個文件的最后一次 git 提交的 UNIX 時間戳(ms),
并且它也會以合適的格式顯示在每個頁面的底部。
挑一下部分設(shè)置的表現(xiàn)

我是head啦

我是側(cè)邊欄

我是nav導航欄,搜索框是默認主題帶的~
總結(jié)
我自己總結(jié)一下,可能不是很對,如果有誤歡迎指正。根據(jù)我之前學hugo的經(jīng)驗來看,config.js配置的是全站的,例如title等等,有些部分是可以在頁面中配置來覆蓋的。例如sidebarDepth這種。
然后讀取的是一個個*.md文件,這些*.md文件上面一部分是front matter,front matter就是針對頁面的一些配置,可覆蓋config.js里的一些配置的值。然后下面接的就是我們的內(nèi)容。hugo中這下面的部分可以是純文字,也可以是自定義的dom結(jié)構(gòu)。
一般來說應該是一個頁面模板,配合多個這個模板的.md文件生成多個模板的內(nèi)容頁【vuepress我還沒有做到后面這步,現(xiàn)在是邊學邊寫,所以如果我做到后面發(fā)現(xiàn)有誤也會回來改正這里。】
在這里貼一下config 和 主題配置的鏈接: 【config走你】、【themeConfig走你】