个人博客体系

一、引言

​ 从上大学开始，接触到计算机后。看了几次别人的技术博客之后我就喜欢上了博客这种方式，特别是markdown，我是一直在用。之前也一直都零零散散的写过一些垃圾博客，但是我的博客一直没有成体系，在不确定的平台、以不确定的内容瞎写。最近搭建了一个网站用来写博客，所以打算写一篇博客记录一下自己的一些方式和经验。 我的整个体系大概就是：本地编辑-云同步-发布，这种方式我用久了觉得还挺方便的，某个环节除了问题也更好代替，不像语雀那些云笔记一样，迁移成本很高。

二、编辑&同步：Typora+坚果云

1. 下载安装Typora和坚果云

Typora以前是免费的，不过后来收费了。

然后我尝试了其它笔记软件：

MarkText，图片显示支持相对路径，粘贴的是绝对路径，对坚果云也不是很支持，会出现同步冲突。

Typedown，图片显示不支持相对路径，粘贴的是绝对路径，支持坚果云同步。

Migi，PC端在文字和图片中会有不断的跳变，眼花缭乱的，有点不舒服。同步机制混乱，有时候莫名重复。

小米笔记，记事很不错，同步快速，可插入图片附件，但是不适合做笔记，不支持markdown；思维笔记不如幕布（完全比不上）。

语雀，支持markdown语法，支持图像插入；小记很好，相当于时间轴笔记，并且可以直接添加到知识库，而且知识库自动分级生成目录，查看文档方便，但是，普通用户不能公开分享以及容量有限制（比如知识库限制10个），而且非本地文件。

有道云笔记，会员才能上传图片，不支持toc语法，不支持相对路径图片。

VScode图片是本地目录地址，很难办。

Notion：适合系统的整理，清单规划，但是每次打开都要重新加载图片，而且加载慢、非本地文件。

Obsidian：入门劝退。

VScode-Typora插件，图片显示支持相对路径，支持绝对路径（得自己设置），粘贴的是相对路径（得自己设置），支持坚果云同步，虽然体验比Typora还是差一点，但是比上面这些要舒服点。

我也尝试过许多其他的MD编辑器，但是都不符合我的要求，最后还是找了一下Typora绿色版本，安装很简单就不说了。

后来由于一些原因不能使用绿色Typora，正版又觉得太贵，所以就用了VScode-Typora插件下位替代。不过这样对于下面的那些方法就不支持了，我就只是用于不能使用Typora的情况，充当个编辑器罢了。

2.下载安装坚果云

坚果云官网下载

3. 设置坚果云同步文件夹

直接选取文件右击->坚果云->同步该文件夹就可以了，这样对这个文件夹的任何改动都会自动同步了，而且会生成历史版本。

坚果云免费用户每个月提供1G上行流量和3G下行流量，用来进行md文件的编写怎么都够用了。

不过记得不要修改同步文件夹的地址，不然就找不到了。

同理也可以使用百度网盘，阿里云盘等软件的同步文件夹功能（我现在只使用小米云盘，6元/月换50G不限速空间还是挺划算的QAQ）

image-20240102222150488

​ 完成以上步骤就可以多设备</u>编辑md文件了。上班和下班，打开不同的设备、不同的配置、不同的系统却还可以对同一文件夹进行操作，而且坚果云还有自己的Markdown软件，平板和手机也可以查看修改自己的内容，还是挺方便的；不仅如此，云端和多本地设备的冗余保护，即使是我其中一个设备坏了，甚至是坚果云服务器烧了，我的数据都很安全，总不可能坚果云本部爆炸的同时我三个电脑也全坏了吧？就算如此，别急，我还搭建了自己的博客网站，上面还有备份呢嘿嘿，咱们接着往下看。

三、图片&图床

​ 对于图片的处理就比较麻烦了，因为在markdown语法中，图片的本质其实是一个超链接，而不是真正的图片，所以使用坚果云同步的图片在别的设备上、或者说复制粘贴到博客网站上时，只是一个链接或者地址。

1. 相对地址法

2. PicGo+图床

1. 软件准备

1. PicGo下载

下载会自动跳转到GitHub，连接不上的看:GitHub连接失败解决办法

GitHub下载很慢，也可以使用山东大学镜像下载。

PicGo指南：https://picgo.github.io/PicGo-Doc/zh/guide/

#Windows

Windows 用户请下载最新版本的 exe 文件。

#macOS

macOS 用户请下载最新版本的 dmg 文件。

#Linux

Linux 用户请下载 AppImage 文件。

  1. Gitee官网

4. node.js菜鸟教程安装指导

本章节我们将向大家介绍在 Windows 和 Linux 上安装 Node.js 的方法。

本安装教程以 Node.js v4.4.3 LTS(长期支持版本)版本为例。

Node.js 安装包及源码下载地址为：https://nodejs.org/en/download/。

nodejs_download

你可以根据不同平台系统选择你需要的 Node.js 安装包。

Node.js 历史版本下载地址：https://nodejs.org/dist/

**注意：**Linux 上安装 Node.js 需要安装 Python 2.6 或 2.7 ，不建议安装 Python 3.0 以上版本。

Windows 上安装 Node.js

你可以采用以下两种方式来安装。

1、Windows 安装包(.msi)

img

本文实例以 v0.10.26 版本为例，其他版本类似， 安装步骤：

步骤 1 : 双击下载后的安装包 v0.10.26，如下所示：

install-node-msi-version-on-windows-step1

步骤 2 : 点击以上的Run(运行)，将出现如下界面：

install-node-msi-version-on-windows-step2

步骤 3 : 勾选接受协议选项，点击 next（下一步） 按钮 :

install-node-msi-version-on-windows-step3

步骤 4 : Node.js默认安装目录为 “C:\Program Files\nodejs” , 你可以修改目录，并点击 next（下一步）：

install-node-msi-version-on-windows-step4

步骤 5 : 点击树形图标来选择你需要的安装模式 , 然后点击下一步 next（下一步）

install-node-msi-version-on-windows-step5

步骤 6 :点击 Install（安装） 开始安装Node.js。你也可以点击 Back（返回）来修改先前的配置。 然后并点击 next（下一步）：

install-node-msi-version-on-windows-step6

安装过程：

install-node-msi-version-on-windows-step7

点击 Finish（完成）按钮退出安装向导。

install-node-msi-version-on-windows-step8

检测PATH环境变量是否配置了Node.js，点击开始=》运行=》输入"cmd" => 输入命令"path"，输出如下结果：

PATH=C:\oraclexe\app\oracle\product\10.2.0\server\bin;C:\Windows\system32;
C:\Windows;C:\Windows\System32\Wbem;C:\Windows\System32\WindowsPowerShell\v1.0\;
c:\python32\python;C:\MinGW\bin;C:\Program Files\GTK2-Runtime\lib;
C:\Program Files\MySQL\MySQL Server 5.5\bin;C:\Program Files\nodejs\;
C:\Users\rg\AppData\Roaming\npm

我们可以看到环境变量中已经包含了C:\Program Files\nodejs\

检查Node.js版本

node-version-test

2、Windows 二进制文件 (.exe)安装

32 位安装包下载地址 : http://nodejs.org/dist/v0.10.26/node.exe

64 位安装包下载地址 : http://nodejs.org/dist/v0.10.26/x64/node.exe

安装步骤

步骤 1 : 双击下载的安装包 Node.exe ，将出现如下界面 :

install-node-exe-on-windows-step1

点击 Run（运行）按钮将出现命令行窗口：

install-node-exe-on-windows-step21

版本测试

进入 node.exe 所在的目录，如下所示：

node-version

如果你获得以上输出结果，说明你已经成功安装了Node.js。

Linux 上安装 Node.js

直接使用已编译好的包

Node 官网已经把 linux 下载版本更改为已编译好的版本了，我们可以直接下载解压后使用：

# wget https://nodejs.org/dist/v10.9.0/node-v10.9.0-linux-x64.tar.xz    // 下载
# tar xf  node-v10.9.0-linux-x64.tar.xz       // 解压
# cd node-v10.9.0-linux-x64/                  // 进入解压目录
# ./bin/node -v                               // 执行node命令 查看版本
v10.9.0

解压文件的 bin 目录底下包含了 node、npm 等命令，我们可以使用 ln 命令来设置软连接：

ln -s /usr/software/nodejs/bin/npm   /usr/local/bin/ 
ln -s /usr/software/nodejs/bin/node   /usr/local/bin/

Ubuntu 源码安装 Node.js

以下部分我们将介绍在 Ubuntu Linux 下使用源码安装 Node.js 。 其他的 Linux 系统，如 Centos 等类似如下安装步骤。

在 Github 上获取 Node.js 源码：

$ sudo git clone https://github.com/nodejs/node.git
Cloning into 'node'...

修改目录权限：

$ sudo chmod -R 755 node

使用 ./configure 创建编译文件，并按照：

$ cd node
$ sudo ./configure
$ sudo make
$ sudo make install

查看 node 版本：

$ node --version
v0.10.25

Ubuntu apt-get 命令安装

命令格式如下：

sudo apt-get install nodejs
sudo apt-get install npm

CentOS 下源码安装 Node.js

1、下载源码，你需要在https://nodejs.org/en/download/下载最新的Nodejs版本，本文以v0.10.24为例:

cd /usr/local/src/
wget http://nodejs.org/dist/v0.10.24/node-v0.10.24.tar.gz

2、解压源码

tar zxvf node-v0.10.24.tar.gz

3、 编译安装

cd node-v0.10.24
./configure --prefix=/usr/local/node/0.10.24
make
make install

4、 配置NODE_HOME，进入profile编辑环境变量

vim /etc/profile

设置 nodejs 环境变量，在 export PATH USER LOGNAME MAIL HOSTNAME HISTSIZE HISTCONTROL 一行的上面添加如下内容:

#set for nodejs
export NODE_HOME=/usr/local/node/0.10.24
export PATH=$NODE_HOME/bin:$PATH

:wq保存并退出，编译/etc/profile 使配置生效

source /etc/profile

验证是否安装配置成功

node -v

输出 v0.10.24 表示配置成功

npm模块安装路径

/usr/local/node/0.10.24/lib/node_modules/

**注：**Nodejs 官网提供了编译好的 Linux 二进制包，你也可以下载下来直接应用。

Mac OS 上安装

你可以通过以下两种方式在 Mac OS 上来安装 node：

  • 1、在

    官方下载网站

    下载 pkg 安装包，直接点击安装即可。

  • 2、使用 brew 命令来安装：

    brew install node

2. Typora，Gitee/Github, PicGo配置

Typora+PicGo+Gitee搭建博客写作环境

接下来我们开始搭建，确保已经安装上述软件和注册 Gitee/GitHub 账号。

Gitee/GitHub 创建图床仓库

在 Gitee/GitHub 创建一个图床仓库，用来存放你的图片。

Gitee步骤

1、创建图床仓库

首先打开你的 Gitee 主页，点击 新建仓库 ，创建一个仓库。

image-20210810174335872

如下图，输入你的仓库信息，必须为 开源，否则无法上传图片。

image-20210810161941077

2、生成私人令牌 Token

点击个人设置–>私人令牌：

image-20210810162720938

点击 +生成新令牌 生成一个私人令牌：

image-20210810162911778

填写描述，然后提交，输入你的 Gitee 账号密码即可，Token 关闭页面后将不再显示，因此需要记录 Token。

image-20210810163126822

至此，Gitee 的配置已经完成。

GitHub步骤

前提：GitHub 与 Gitee 大同小异，最好有 🪜 ，不然不建议使用 Github，以下只是演示下如何使用。

1、创建图床仓库

image-20210810163858499

这里和 Gitee 大同小异，填写相关信息即可。

image-20210810164240474

2、生成私人令牌 Token

打开 github.com/settings/to… Generate new token 创建一个私人令牌：

image-20210810164905375

选择 无限期，勾选 repo 即可：

image-20210810165146963

同样的，保存好你的 Token：

image-20210810165432798

至此，Github已配置完成。

配置 PicGo

GitHub 图床配置

打开 PicGo 详细窗口，根据提示填入 GitHub 图床仓库的相关信息：

image-20210810165805839

这个很简单，不做解释，相信以你的聪明才智，分分钟搞定。

Gitee 图床配置

由于 PicGo 原生不支持 Gitee，因此需要通过插件安装。

点击插件设置，搜索 gitee-upload ，点击安装。

image-20210810170110623

注意：这里需要提前安装 node.js，否则无法安装！

插件安装成功后，重启 PicGo ，然后配置 gitee：

image-20210810170358801

配置方式与 GitHub 大同小异。

经过如上配置，图床已经搭建成功，可以通过上传图片测试：

image-20210810170522129

点击上传图片，然后复制到 markdown 编辑器中查看。

配置 Typora

为什么要配置 Typora ？当然是为了方便，不能每次都手动去上传图片，然后复制链接吧，只需要简单配置 Typora 就可以实现复制图片自动上传。

image-20210810172414616

配置如上，选择插入图片时选择 PicGo.app 即可！就这么简单~

测试一下最终效果，直接截图当前界面，上传粘贴：

test

image-20210810172807755

可以发现，已经自动实现上传了！

作者：Lucifer三思而后行 链接：https://juejin.cn/post/7016511287030972452 来源：稀土掘金 著作权归作者所有。商业转载请联系作者获得授权，非商业转载请注明出处。

3. 上传失败

  1. 仓库名一定不能错(区分大小写),详细的阅读:PicGo+typora上传图片出现404 - {“message“:“Not Found Project“}

    img

  2. 仓库名不能有空格

  3. 在PicGo和Gitee中能正常上传,但是复制到CSDN上时无法正常上传。是因为需要使用markdown编辑器，富文本编辑器不支持

如果还有其他问题,配置打开日志文件,设置成只看error,然后打开日志文件根据报错查找相应解决方法.

4.使用坚果云同步文件

右击文件,选择:坚果云-同步该文件,即可实现本地文件和云文件的同步修改与增删.

自建博客网站