当前位置： 首页 > news >正文

docsify gitee 搭建个人博客

news 2025/9/30 9:26:23

docsify & gitee 搭建个人博客

文章目录

  • docsify & gitee 搭建个人博客
    • 1.npm 安装
      • 1.1 在Windows上安装npm：
      • 1.2 在macOS上安装npm：
      • 1.3 linux 安装npm
    • 2. docsify
      • 2.1 安装docsify
      • 2.2 自定义配置
        • 2.2.1 通过修改index.html，定制化开发页面
      • 2.2.2 顶部导航栏和侧边栏
        • 2.2.3 新建 _navbar.md 文件
        • 2.2.4 侧边栏设置
        • 2.2.5 全文检索
        • 2.2.6 一键仿制插件
        • 2.2.7 代码高亮
        • 2.2.8 代码高亮
        • 2.2.9 自定义封面
    • 3.gitee 搭建库
    • 4 设置Github Pages

1.npm 安装

npm是Node.js的包管理器，用于安装和管理JavaScript包。要安装npm，需要先安装Node.js。以下是在不同操作系统上安装npm的步骤：

1.1 在Windows上安装npm：

  1. 访问Node.js官方网站（https://nodejs.org）。
  2. 在下载页面上，选择适用于Windows的LTS版本（长期支持版本）的Node.js安装程序。
  3. 下载安装程序并运行它。
  4. 在安装过程中，确保选中"npm package manager"选项。
  5. 完成安装后，打开命令提示符或PowerShell，并运行npm -v命令，确认npm已成功安装。

1.2 在macOS上安装npm：

  1. 打开终端应用程序。
  2. 使用Homebrew包管理器安装Node.js。运行以下命令：
  brew install node
  1. 完成安装后，运行npm -v命令，确认npm已成功安装。

1.3 linux 安装npm

在Linux上安装npm：

  1. 打开终端。
  2. 使用包管理器安装Node.js。根据你使用的Linux发行版，运行以下命令之一：
  • Debian/Ubuntu：
	sudo apt-get install nodejs npm
  • Fedora：
    sudo dnf install nodejs npm
  • CentOS/RHEL：
     sudo yum install nodejs npm

安装完成后，你可以使用npm install 命令来安装JavaScript包。例如，要安装名为"lodash"的包，可以运行npm install lodash命令。

2. docsify

2.1 安装docsify

# 安装 docsify-cli
npm i docsify-cli -g
# 初始化项目
docsify init ./docs
# 发动项目
docsify serve docs

image-20230812092252353

image-20230812092328875

image-20230812092420688

http://localhost:3000/#/ 成功截图：

image-20230812092559318

2.2 自定义配置

2.2.1 通过修改index.html，定制化开发页面

<!DOCTYPE html>
<html lang="en">
<head><meta charset="UTF-8"><title>Document</title><meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1" /><meta name="description" content="Description"><meta name="viewport" content="width=device-width, initial-scale=1.0, minimum-scale=1.0"><link rel="stylesheet" href="//cdn.jsdelivr.net/npm/docsify@4/lib/themes/vue.css">
</head>
<body><div id="app"></div><script>window.$docsify = {name: '',repo: ''}</script><!-- Docsify v4 --><script src="//cdn.jsdelivr.net/npm/docsify@4"></script>
</body>
</html>

2.2.2 顶部导航栏和侧边栏

   window.$docsify = {name: '东小西', // 侧边栏顶部显现的称号repo: 'https://gitee.com/chen_1953981601', // 右上角Github图标链接,这是例子，需要具体换为自己的loadNavbar: true, // 默许加载 _navbar.md，作为顶部导航栏loadSidebar: true // 默许加载 _sidebar.md，作为侧边栏}

2.2.3 新建 _navbar.md 文件

- [**目录**](README.md)- [**环境安装**](source/env/env.md)- [**编程相关学习**](source/books/books.md)- [**人工智能**](source/DL/DL.md)- [**工程部署相关问题**](source/project/project.md)- [**相关开源工具**](source/openTech/openTech.md)- **论文阅读笔记**
* [**文章集合**](paper/README.md)

2.2.4 侧边栏设置

 window.$docsify = {name: '东小西', // 侧边栏顶部显现的称号repo: 'https://gitee.com/renxiaoshi', // 右上角Github图标链接loadNavbar: true, // 默许加载 _navbar.md，作为顶部导航栏loadSidebar: true, // 默许加载 _sidebar.md，作为侧边栏subMaxLevel: 3, // 目录的最大层级}

2.2.5 全文检索

  window.$docsify = {name: '东小西', // 侧边栏顶部显现的称号repo: 'https://gitee.com/c_1953981601', // 右上角Github图标链接loadNavbar: true, // 默许加载 _navbar.md，作为顶部导航栏loadSidebar: true, // 默许加载 _sidebar.md，作为侧边栏subMaxLevel: 3, // 目录的最大层级search: {paths: 'auto',placeholder: '检索',noData: '没有找到喔！',depth: 3,},}<!-- 检索插件 --><script src="//cdn.jsdelivr.net/npm/docsify/lib/plugins/search.min.js"></script>

2.2.6 一键仿制插件

 <!-- 一键仿制插件 --><script src="//cdn.jsdelivr.net/npm/docsify-copy-code"></script>

2.2.7 代码高亮

<!-- 代码高亮 --><script src="//cdn.jsdelivr.net/npm/prismjs@1/components/prism-bash.min.js"></script><script src="//cdn.jsdelivr.net/npm/prismjs@1/components/prism-c.min.js"></script><script src="//cdn.jsdelivr.net/npm/prismjs@1/components/prism-json.min.js"></script><script src="//cdn.jsdelivr.net/npm/prismjs@1/components/prism-shell-session.min.js"></script><script src="//cdn.jsdelivr.net/npm/prismjs@1/components/prism-python.min.js"></script><script src="//cdn.jsdelivr.net/npm/prismjs@1/components/prism-http.min.js"></script><script src="//cdn.jsdelivr.net/npm/prismjs@1/components/prism-java.min.js"></script>

2.2.8 代码高亮

<link rel="stylesheet" href="//cdn.jsdelivr.net/npm/docsify/themes/dark.css">

2.2.9 自定义封面

window.$docsify 中添加 coverpage: true，默许会加载 _coverpage.md。

新建_coverpage.md文件，内容如下：

# Blogs for SWPUCWF> 如果不是为了让她哭，那么卷人又有什么意义？[CSDN](https://blog.csdn.net/weixin_42917352?spm=1000.2115.3001.5343)email: swpucwf@126.com[滚动鼠标](#)

3.gitee 搭建库

Gitee Pages服务，代码托管网站将用户的库房文件以网页方式发布。

image-20230812105527551

4 设置Github Pages

在 Settings 中的 GitHub Pages 中选择 docs 文件夹，点击保存，即可发布刚刚的文档网站。

相关文章：

docsify gitee 搭建个人博客

docsify & gitee 搭建个人博客 文章目录 docsify & gitee 搭建个人博客1.npm 安装1.1 在Windows上安装npm&#xff1a;1.2 在macOS上安装npm&#xff1a;1.3 linux 安装npm 2. docsify2.1 安装docsify2.2 自定义配置2.2.1 通过修改index.html&#xff0c;定制化开发页面…...

编程日记 2023/8/13 20:16:48

SpringBoot2-Tomcat部署

1.排除内置 Tomcat 在pom.xml文件中的下添加以下代码&#xff0c;用于排除SpringBoot内置Tomcat <dependency><groupId>org.springframework.boot</groupId><artifactId>spring-boot-starter-web</artifactId><exclusions><exclusion&…...

编程日记 2023/8/13 20:15:46

Docker查看、创建、进入容器相关的命令

1.查看、创建、进入容器的指令 用-it指令创建出来的容器&#xff0c;创建完成之后会立马进入容器。退出之后立马关闭容器。 docker run -it --namec1 centos:7 /bin/bash退出容器&#xff1a; exit查看现在正在运行的容器命令&#xff1a; docker ps查看历史容器&#xff0…...

编程日记 2023/8/13 20:14:45

leetcode1. 两数之和

题目&#xff1a;leetcode1. 两数之和 描述&#xff1a; 给定一个整数数组 nums 和一个整数目标值 target&#xff0c;请你在该数组中找出 和为目标值 target 的那 两个 整数&#xff0c;并返回它们的数组下标。 你可以假设每种输入只会对应一个答案。但是&#xff0c;数组中…...

编程日记 2023/8/13 20:13:44

温室花卉种植系统springboot框架jsp鲜花养殖智能管理java源代码

本项目为前几天收费帮学妹做的一个项目&#xff0c;Java EE JSP项目&#xff0c;在工作环境中基本使用不到&#xff0c;但是很多学校把这个当作编程入门的项目来做&#xff0c;故分享出本项目供初学者参考。 一、项目描述 基于Git无线传感网络的温室花卉种植智能控制系统 系统…...

编程日记 2023/8/13 20:12:43

测试老鸟经验总结，Jmeter性能测试-重要指标与性能结果分析（超细）

目录&#xff1a;导读 前言一、Python编程入门到精通二、接口自动化项目实战三、Web自动化项目实战四、App自动化项目实战五、一线大厂简历六、测试开发DevOps体系七、常用自动化测试工具八、JMeter性能测试九、总结&#xff08;尾部小惊喜&#xff09; 前言 Aggregate Report …...

编程日记 2023/8/13 20:11:42

IDEA设置Maven自动编译model

IDEA设置Maven自动编译model 项目工程结构IDEA maven设置 项目工程结构 假设我们的项目结构是下图这样&#xff0c;也就是一个父工程下包含多个子模块&#xff0c;其中dubbo-01-api是公共模块&#xff0c;其它两个模块要想使用必须在pom文件中引入。 本地开发要想不会报错&am…...

编程日记 2023/8/13 20:10:41

关于本地mockjs的使用

安装mockjs npm install mockjs -s在src下新建目录mockData&#xff0c;所有mock请求可以放该文件夹下面。例如在mockData文件夹下新建一个home.js文件。用来处理首页的请求数据 home.js export default {getHomeData:()>{return{code:200,data:{tableData:[{name:张三,se…...

编程日记 2023/8/13 20:09:39

hive 中最常用日期处理函数

hive 常用日期处理函数 在工作中&#xff0c;日期函数是提取数据计算数据必须要用到的环节。哪怕是提取某个时间段下的明细数据也得用到日期函数。今天和大家分享一下常用的日期函数。为什么说常用呢&#xff1f;其实这些函数在数据运营同学手上是几乎每天都在使用的。 技术交…...

编程日记 2023/8/13 20:08:39

记录一下Java实体转json字段顺序问题

特殊需求&#xff0c;和C交互他们那边要求字段顺序要和他们定义的一致(批框架) 如下&#xff1a; Data public class UserDto {private String name;private Integer age;private String addr; }未转换前打印&#xff1a; 转换后打印&#xff1a; 可以看到转换为json顺序打印…...

编程日记 2023/8/13 20:07:37

微积分入门：总结归纳汇总（一）

基础 标准符号约定： ( s i n x ) n (sinx)^n (sinx)...

编程日记 2023/8/13 20:06:36

ubuntu python虚拟环境venv搭配systemd服务实战（禁用缓存下载--no-cache-dir）

文章目录 参考文章目录结构步骤安装venv查看python版本创建虚拟环境激活虚拟环境运行我们程序看缺少哪些依赖库&#xff0c;依次安装它们接下来我们配置python程序启动脚本&#xff0c;脚本中启动python程序前需先激活虚拟环境配置.service文件然后执行部署脚本&#xff0c;成功…...

编程日记 2023/8/13 20:05:23

案例15 Spring Boot入门案例

1. 选择Spring Initializr快速构建项目 ​ 2. 设置项目信息 ​ 3. 选择依赖 ​ 4. 设置项目名称 ​ 5. 项目结构 ​ 6. 项目依赖 自动配置了Spring MVC、内置了Tomcat、配置了Logback(日志)、配置了JSON。 ​ 7. 创建HelloController类 com.wfit.boot.hello目录下创建HelloCo…...

编程日记 2023/8/13 20:04:18

物联网是下一个风口吗？

随着科技的持续进步&#xff0c;物联网行业正在迅速兴起&#xff0c;展现出巨大的潜力。那么&#xff0c;物联网行业的未来是什么样的呢&#xff1f; 1. 5G技术的广泛应用和普及 随着5G技术的快速发展和商业化推广&#xff0c;物联网行业将迎来一个巨大的飞跃。5G技术的高速传…...

编程日记 2023/8/13 20:03:16

8月9日上课内容 nginx反向代理与负载均衡

负载均衡工作当中用的很多的&#xff0c;也是面试会问的很重要的一个点 负载均衡&#xff1a;通过反向代理来实现&#xff08;nginx只有反向代理才能做负载均衡&#xff09; 正向代理的配置方法&#xff08;用的较少&#xff09; 反向代理的方式&#xff1a;四层代理与七层代…...

编程日记 2023/8/13 20:02:14

易服客工作室：Elementor AI简介 – 彻底改变您创建网站的方式

Elementor 作为领先的 WordPress 网站构建器&#xff0c;是第一个添加本机 AI 集成的。Elementor AI 的第一阶段将使您能够生成和改进文本和自定义代码&#xff08;HTML、自定义代码和自定义 CSS&#xff09;。我们还已经在进行以下阶段的工作&#xff0c;其中将包括基于人工智…...

编程日记 2023/8/13 20:01:07

ClickHouse的数据类型

1.整数型 固定长度的整型&#xff0c;包括有符号整型或无符号整型。整型范围&#xff08;-2n-1~2n-1-1&#xff09;&#xff1a; Int8 - [-128 : 127] Int16 - [-32768 : 32767] Int32 - [-2147483648 : 2147483647] Int64 - [-9223372036854775808 : 9223372036854775807]无符…...

编程日记 2023/8/13 20:00:04

计算机网络—IP

这里写目录标题 IP的基本认识网络层与数据链路层有什么关系IP地址基础知识IP 地址的分类什么是A、B、C类地址广播地址用来做什么什么是D、E类广播多播地址用于什么IP分类的优点IP分类的缺点 无分类地址CIDR如何划分网络号和主机号怎么进性子网划分 公有 IP 地址与私有 IP 地址公…...

编程日记 2023/8/13 19:59:03

Java 的 Stream

一、创建 Stream 1.1、创建 Stream 流 1.1.1、List 集合获取 Stream 流 Collection<String> list new ArrayList<>(); Stream<String> s1 list.stream(); 1.1.2、Map 集合获取 stream 流 Map<String, Integer> map new HashMap<>(); // …...

编程日记 2023/8/13 19:58:01

SolidUI社区-Discord

背景 随着文本生成图像的语言模型兴起&#xff0c;SolidUI想帮人们快速构建可视化工具&#xff0c;可视化内容包括2D,3D,3D场景&#xff0c;从而快速构三维数据演示场景。SolidUI 是一个创新的项目&#xff0c;旨在将自然语言处理&#xff08;NLP&#xff09;与计算机图形学相…...

编程日记 2023/8/13 19:56:59

观成科技：隐蔽隧道工具Ligolo-ng加密流量分析

1.工具介绍 Ligolo-ng是一款由go编写的高效隧道工具&#xff0c;该工具基于TUN接口实现其功能&#xff0c;利用反向TCP/TLS连接建立一条隐蔽的通信信道&#xff0c;支持使用Let’s Encrypt自动生成证书。Ligolo-ng的通信隐蔽性体现在其支持多种连接方式&#xff0c;适应复杂网…...

编程新知 2025/9/29 6:51:26

反向工程与模型迁移：打造未来商品详情API的可持续创新体系

在电商行业蓬勃发展的当下&#xff0c;商品详情API作为连接电商平台与开发者、商家及用户的关键纽带&#xff0c;其重要性日益凸显。传统商品详情API主要聚焦于商品基本信息&#xff08;如名称、价格、库存等&#xff09;的获取与展示&#xff0c;已难以满足市场对个性化、智能…...

编程新知 2025/9/15 5:56:53

FastAPI 教程：从入门到实践

FastAPI 是一个现代、快速&#xff08;高性能&#xff09;的 Web 框架&#xff0c;用于构建 API&#xff0c;支持 Python 3.6。它基于标准 Python 类型提示&#xff0c;易于学习且功能强大。以下是一个完整的 FastAPI 入门教程&#xff0c;涵盖从环境搭建到创建并运行一个简单的…...

编程新知 2025/9/2 4:01:22

django filter 统计数量 按属性去重

在Django中&#xff0c;如果你想要根据某个属性对查询集进行去重并统计数量&#xff0c;你可以使用values()方法配合annotate()方法来实现。这里有两种常见的方法来完成这个需求&#xff1a; 方法1&#xff1a;使用annotate()和Count 假设你有一个模型Item&#xff0c;并且你想…...

编程新知 2025/9/29 21:28:27

MVC 数据库

MVC 数据库 引言 在软件开发领域，Model-View-Controller（MVC）是一种流行的软件架构模式，它将应用程序分为三个核心组件：模型（Model）、视图（View）和控制器（Controller）。这种模式有助于提高代码的可维护性和可扩展性。本文将深入探讨MVC架构与数据库之间的关系，以…...

编程新知 2025/8/16 14:02:21

VTK如何让部分单位不可见

最近遇到一个需求&#xff0c;需要让一个vtkDataSet中的部分单元不可见&#xff0c;查阅了一些资料大概有以下几种方式 1.通过颜色映射表来进行&#xff0c;是最正规的做法 vtkNew<vtkLookupTable> lut; //值为0不显示&#xff0c;主要是最后一个参数&#xff0c;透明度…...

编程新知 2025/9/22 18:49:24

Robots.txt 文件

什么是robots.txt&#xff1f; robots.txt 是一个位于网站根目录下的文本文件&#xff08;如&#xff1a;https://example.com/robots.txt&#xff09;&#xff0c;它用于指导网络爬虫&#xff08;如搜索引擎的蜘蛛程序&#xff09;如何抓取该网站的内容。这个文件遵循 Robots…...

编程新知 2025/9/9 5:38:23

Python如何给视频添加音频和字幕

在Python中&#xff0c;给视频添加音频和字幕可以使用电影文件处理库MoviePy和字幕处理库Subtitles。下面将详细介绍如何使用这些库来实现视频的音频和字幕添加&#xff0c;包括必要的代码示例和详细解释。 环境准备 在开始之前&#xff0c;需要安装以下Python库&#xff1a;…...

编程新知 2025/9/3 4:12:17

Java入门学习详细版（一）

大家好&#xff0c;Java 学习是一个系统学习的过程&#xff0c;核心原则就是“理论 实践 坚持”&#xff0c;并且需循序渐进&#xff0c;不可过于着急&#xff0c;本篇文章推出的这份详细入门学习资料将带大家从零基础开始&#xff0c;逐步掌握 Java 的核心概念和编程技能。 …...

编程新知 2025/7/27 0:21:52

JVM暂停（Stop-The-World，STW）的原因分类及对应排查方案

JVM暂停（Stop-The-World，STW）的完整原因分类及对应排查方案，结合JVM运行机制和常见故障场景整理而成： 一、GC相关暂停​​ 1. ​​安全点（Safepoint）阻塞​​ ​​现象​​：JVM暂停但无GC日志，日志显示No GCs detected。​​原因​​：JVM等待所有线程进入安全点（如…...

编程新知 2025/8/25 19:36:37