VuePress2.0構建項目文檔系統

来源:https://www.cnblogs.com/raok/archive/2023/06/01/17443997.html
-Advertisement-
Play Games

# VuePress2.0構建項目文檔系統 參考TerraMours 官網。[https://terramours.site/](https://terramours.site/) 文件結構參考: ![image-20230530170541496](https://www.raokun.top/u ...


VuePress2.0構建項目文檔系統

參考TerraMours 官網。https://terramours.site/

文件結構參考:

image-20230530170541496

1.修改首頁README.md

修改項目下的README.md,修改內容:

---
home: true
heroImage: images/hero.png
heroText: TerraMours
actions:
  - text: 快速開始
    link: /guide/
    type: primary
  - text: 演示站點
    link: http://43.134.164.127:8089/
    type: secondary
features:
- title: 簡潔高效
  details: TerraMours 採用了 Masa的MinimalAPI,通過極簡的代碼實現了高效的 HTTP API 介面的同時,提供更高的性能和更低的延遲。
- title: 領域驅動設計(DDD)
  details: TerraMours 框架實現領域驅動設計(DDD)的落地,提供更好的業務識別和管理,更好的模塊劃分,更好的數據映射,更好的維護性和可擴展性。
- title: 擴展開發
  details: TerraMours 已經實現了用戶管理、許可權驗證、日誌管理等基礎功能,開發者可以根據業務需求快速開發相關業務系統。
footer: MIT Licensed | Copyright (c) 2023 firstsaofan
---

2.修改package.json

添加腳本:

{
  "name": "TerraMours-Starter",
  "version": "1.0.0",
  "description": "",
  "main": "index.js",
  "homepage": "https://github.com/vuepress",
  "bugs": {
    "url": "https://github.com/vuepress/vuepress-next/issues"
  },
  "repository": {
    "type": "git",
    "url": "git+https://github.com/vuepress/vuepress-next.git"
  },
  "scripts": {
    "test": "echo \"Error: no test specified\" && exit 1",
    "docs:dev": "vuepress dev docs",
    "docs:build": "vuepress build docs"
  },
  "keywords": [],
  "author": "",
  "license": "ISC",
  "devDependencies": {
    "@vuepress/client": "2.0.0-beta.62",
    "@vuepress/plugin-docsearch": "2.0.0-beta.62",
    "vue": "^3.3.4",
    "vuepress": "2.0.0-beta.62"
  }
}

3.補全.vuepress

在.vuepress下補全配置文件

1.創建配置文件

在.vuepress文件夾下創建文件config.js,內容:

import { defaultTheme } from 'vuepress'
import { docsearchPlugin } from '@vuepress/plugin-docsearch'
import { defineUserConfig} from 'vuepress'
import {
  navbarEn,
  navbarZh,
  sidebarEn,
  sidebarZh,
} from './configs/index.js'
// const isProd = process.env.NODE_ENV === 'production'
const isProd = false
export default defineUserConfig({
    // set site base to default value
    base: '/',

    // extra tags in `<head>`
    // head,

    // site-level locales config
    locales: {
        '/': {
          lang: 'zh-CN',
          title: 'TerraMours',
          description: 'TerraMours 開源項目',
        },
        '/en/': {
        lang: 'en-US',
        title: 'TerraMours',
        description: 'TerraMours FrameWork',
        },
    },
    // configure default theme
  theme: defaultTheme({
    logo: '/images/hero.png',
    repo: 'firstsaofan/TerraMours',
    docsDir: 'docs',

    // theme-level locales config
    locales: {
      /**
       * English locale config
       *
       * As the default locale of @vuepress/theme-default is English,
       * we don't need to set all of the locale fields
       */
      '/': {
        // navbar
        navbar: navbarZh,
        selectLanguageName: '簡體中文',
        selectLanguageText: '選擇語言',
        selectLanguageAriaLabel: '選擇語言',
        // sidebar
        sidebar: sidebarZh,
        // page meta
        editLinkText: '在 GitHub 上編輯此頁',
        lastUpdatedText: '上次更新',
        contributorsText: '貢獻者',
        // custom containers
        tip: '提示',
        warning: '註意',
        danger: '警告',
        // 404 page
        notFound: [
          '這裡什麼都沒有',
          '我們怎麼到這來了?',
          '這是一個 404 頁面',
          '看起來我們進入了錯誤的鏈接',
        ],
        backToHome: '返迴首頁',
        // a11y
        openInNewWindow: '在新視窗打開',
        toggleColorMode: '切換顏色模式',
        toggleSidebar: '切換側邊欄',
        
      },

      /**
       * Chinese locale config
       */
      '/en/': {
        // navbar
        navbar: navbarEn,
        // sidebar
        sidebar: sidebarEn,
        // page meta
        editLinkText: 'Edit this page on GitHub',
      },
    },

    themePlugins: {
      // only enable git plugin in production mode
      git: isProd,
      // use shiki plugin in production mode instead
      prismjs: !isProd,
    },
  }),
  // use plugins
  plugins: [
    docsearchPlugin({
      appId: '34YFD9IUQ2',
      apiKey: '9a9058b8655746634e01071411c366b8',
      indexName: 'vuepress',
      searchParameters: {
        facetFilters: ['tags:v2'],
      },
      locales: {
        '/': {
          placeholder: '搜索文檔',
          translations: {
            button: {
              buttonText: '搜索文檔',
              buttonAriaLabel: '搜索文檔',
            },
            modal: {
              searchBox: {
                resetButtonTitle: '清除查詢條件',
                resetButtonAriaLabel: '清除查詢條件',
                cancelButtonText: '取消',
                cancelButtonAriaLabel: '取消',
              },
              startScreen: {
                recentSearchesTitle: '搜索歷史',
                noRecentSearchesText: '沒有搜索歷史',
                saveRecentSearchButtonTitle: '保存至搜索歷史',
                removeRecentSearchButtonTitle: '從搜索歷史中移除',
                favoriteSearchesTitle: '收藏',
                removeFavoriteSearchButtonTitle: '從收藏中移除',
              },
              errorScreen: {
                titleText: '無法獲取結果',
                helpText: '你可能需要檢查你的網路連接',
              },
              footer: {
                selectText: '選擇',
                navigateText: '切換',
                closeText: '關閉',
                searchByText: '搜索提供者',
              },
              noResultsScreen: {
                noResultsText: '無法找到相關結果',
                suggestedQueryText: '你可以嘗試查詢',
                reportMissingResultsText: '你認為該查詢應該有結果?',
                reportMissingResultsLinkText: '點擊反饋',
              },
            },
          },
        },
      },
    }),
  ],
})
    

2.添加public文件夾

存放一些公共文件,比如圖標,xml等

1.添加images文件夾

保存圖片,將logo放在文件夾下

3.添加configs文件夾

存放配置

1.添加navbar文件夾

導航欄配置

1.添加zh.ts(中文配置)

image-20230530170924937

內容:

import type { NavbarConfig } from 'vuepress'
export const navbarZh: NavbarConfig =[
    {
        text: '指南',
        link: '/guide/',
      },
      {
        text: '項目開發者',
        children: [
          {
            text:"firstsaofan",
            link:"https://www.firstsaofan.top/"
          },
          {
            text:"raokun",
            link:"https://www.raokun.top/"
          }
        ],
      },
]

2.添加index.ts(配置引用)

image-20230530170909251

內容:

export * from './en.js'
export * from './zh.js'

3.添加en.ts(英文配置)

同zh.ts

2.添加sidebar文件夾

側邊欄配置

1.添加zh.ts(中文配置)

image-20230530171018728

2.添加index.ts(配置引用)

image-20230530170956070

3.添加en.ts(英文配置)

同zh.ts

4.創建md文件

參考結構圖,新增自己的MD文件,然後在sidebar的配置中添加對應的文件路徑配置

5.啟動項目命令

pnpm docs:dev

6.項目展示

參考TerraMours 官網。https://terramours.site/

image-20230530171423534

額外配置:全局查找

https://v2.vuepress.vuejs.org/zh/reference/plugin/docsearch.html

使用方法

pnpm i -D @vuepress/plugin-docsearch@next
import { docsearchPlugin } from '@vuepress/plugin-docsearch'

export default {
  plugins: [
    docsearchPlugin({
      // 配置項
    }),
  ],
}
閱讀如遇樣式問題,請前往個人博客瀏覽: https://www.raokun.top
擁抱ChatGPT:https://ai.terramours.site
開源項目地址:https://github.com/firstsaofan/TerraMours

您的分享是我們最大的動力!

-Advertisement-
Play Games
更多相關文章
  • 英語類的數據其實已經有很多很多人,但是不同的需求適合的也會是各種的不同,甚至可能需要將多個相關的數據整合起來應用,而今天這份資料庫對於整合來說是非常方便的,因為它是以單詞為關鍵詞進行各種關聯的,也就是說只要是英語類的數據都可以與這份數據關聯起來。 這個數據的好處在於有17830個英語的真人讀音MP3 ...
  • 本文將從 [FTP Connector ](https://www.dtstack.com/resources/1044?src=szsm)的功能詳解,[自定義文件切割](https://www.dtstack.com/resources/1044?src=szsm)及[自定義 FileFormat ...
  • 電影臺詞中有不少令人難忘的好句子,很多時候,愛上一部電影不是因為鏡頭裡的帥哥靚女,不是因為故事情節的跌宕起伏,只是因為有那麼一句話,在主人公說出口的那一瞬間,擊中我們內心最柔軟的部分。本資料庫收錄經典電影臺詞大全,讓我們來欣賞每部電影的經典臺詞、經典對白。此外,還收錄了部分晚會、小品的經典臺詞。收錄 ...
  • 今天想聊一下分庫分表,因為對於快速增長的業務來說,這個是無法迴避的一環。之前我在做商城相關的SAAS系統,商品池是一個存儲瓶頸,商品池數量會基於租戶增長和運營變得指數級增長,短短幾個月就能漲到幾千萬的數據,而運營半年後就可能過億。而對於訂單這種數據,也會跟著業務的成長,也會變得愈發巨大。 ...
  • > 你準備好面試了嗎?這裡有一些面試中可能會問到的問題以及相對應的答案。如果你需要更多的面試經驗和麵試題,關註一下"張飛的豬大數據分享"吧,公眾號會不定時的分享相關的知識和資料。 [TOC] ## 1、 HDFS 中的 block 預設保存幾份? 預設保存3份 ## 2、HDFS 預設 BlockS ...
  • 雖然漢字#起名名字#的資料庫已經有一些,比如7千多漢字起名參考大典ACCESS資料庫、漢字起名中文起名寶寶起名ACCESS資料庫,但是今天發現了一個資料庫,他是在《7千多漢字起名參考大典》的基礎上增加了30萬個男孩女孩的名字實例。非常適合於比如固定了名字的第二個字,取第三個字時一查就有參考。 漢字表 ...
  • 燈謎,即寫在彩燈上面的謎語,又叫“燈虎”。猜燈謎又叫“射燈虎”。謎語來源於民間口謎,後經文人加工成為謎,它在中國源遠流長。春秋戰國時期,出現了“隱語”或“庾辭”。秦漢時則成為一種書面創作。三國時代,猜謎盛行。在宋代出現了燈謎。人們將謎條繫於五彩花燈上,供人猜射。明清時代,猜燈謎在民間十分流行。 按“ ...
  • 這裡給大家分享我在網上總結出來的一些知識,希望對大家有所幫助 面試官:“HTTPS的加密過程你知道麽?” 我:“那肯定知道啊。” 面試官:“那你知道什麼情況下 HTTPS 不安全麽” 我:“這....” 越面覺得自己越菜,繼續努力學習!!! 什麼是中間人攻擊? 中間人攻擊(MITM)在密碼學和電腦 ...
一周排行
    -Advertisement-
    Play Games
  • 概述:在C#中,++i和i++都是自增運算符,其中++i先增加值再返回,而i++先返回值再增加。應用場景根據需求選擇,首碼適合先增後用,尾碼適合先用後增。詳細示例提供清晰的代碼演示這兩者的操作時機和實際應用。 在C#中,++i 和 i++ 都是自增運算符,但它們在操作上有細微的差異,主要體現在操作的 ...
  • 上次發佈了:Taurus.MVC 性能壓力測試(ap 壓測 和 linux 下wrk 壓測):.NET Core 版本,今天計劃準備壓測一下 .NET 版本,來測試並記錄一下 Taurus.MVC 框架在 .NET 版本的性能,以便後續持續優化改進。 為了方便對比,本文章的電腦環境和測試思路,儘量和... ...
  • .NET WebAPI作為一種構建RESTful服務的強大工具,為開發者提供了便捷的方式來定義、處理HTTP請求並返迴響應。在設計API介面時,正確地接收和解析客戶端發送的數據至關重要。.NET WebAPI提供了一系列特性,如[FromRoute]、[FromQuery]和[FromBody],用 ...
  • 原因:我之所以想做這個項目,是因為在之前查找關於C#/WPF相關資料時,我發現講解圖像濾鏡的資源非常稀缺。此外,我註意到許多現有的開源庫主要基於CPU進行圖像渲染。這種方式在處理大量圖像時,會導致CPU的渲染負擔過重。因此,我將在下文中介紹如何通過GPU渲染來有效實現圖像的各種濾鏡效果。 生成的效果 ...
  • 引言 上一章我們介紹了在xUnit單元測試中用xUnit.DependencyInject來使用依賴註入,上一章我們的Sample.Repository倉儲層有一個批量註入的介面沒有做單元測試,今天用這個示例來演示一下如何用Bogus創建模擬數據 ,和 EFCore 的種子數據生成 Bogus 的優 ...
  • 一、前言 在自己的項目中,涉及到實時心率曲線的繪製,項目上的曲線繪製,一般很難找到能直接用的第三方庫,而且有些還是定製化的功能,所以還是自己繪製比較方便。很多人一聽到自己畫就害怕,感覺很難,今天就分享一個完整的實時心率數據繪製心率曲線圖的例子;之前的博客也分享給DrawingVisual繪製曲線的方 ...
  • 如果你在自定義的 Main 方法中直接使用 App 類並啟動應用程式,但發現 App.xaml 中定義的資源沒有被正確載入,那麼問題可能在於如何正確配置 App.xaml 與你的 App 類的交互。 確保 App.xaml 文件中的 x:Class 屬性正確指向你的 App 類。這樣,當你創建 Ap ...
  • 一:背景 1. 講故事 上個月有個朋友在微信上找到我,說他們的軟體在客戶那邊隔幾天就要崩潰一次,一直都沒有找到原因,讓我幫忙看下怎麼回事,確實工控類的軟體環境複雜難搞,朋友手上有一個崩潰的dump,剛好丟給我來分析一下。 二:WinDbg分析 1. 程式為什麼會崩潰 windbg 有一個厲害之處在於 ...
  • 前言 .NET生態中有許多依賴註入容器。在大多數情況下,微軟提供的內置容器在易用性和性能方面都非常優秀。外加ASP.NET Core預設使用內置容器,使用很方便。 但是筆者在使用中一直有一個頭疼的問題:服務工廠無法提供請求的服務類型相關的信息。這在一般情況下並沒有影響,但是內置容器支持註冊開放泛型服 ...
  • 一、前言 在項目開發過程中,DataGrid是經常使用到的一個數據展示控制項,而通常表格的最後一列是作為操作列存在,比如會有編輯、刪除等功能按鈕。但WPF的原始DataGrid中,預設只支持固定左側列,這跟大家習慣性操作列放最後不符,今天就來介紹一種簡單的方式實現固定右側列。(這裡的實現方式參考的大佬 ...