想开启高效写作模式，有没有技巧？

2021-07-02 15:42:42 浏览数 (1)
【5分钟玩转Lighthouse】系列文章将为大家分享轻量应用服务器使用教程，提供丰富的实践指南，帮助大家快速上手并获得最佳产品体验。本期主要介绍如何借力 Lighthouse 实例与 Chevereto/PicGo/Typora 打造沉浸式 Markdown 写作环境。

背景介绍

在使用 Markdown 写文章插入图片后，由于使用的是本地电脑的图片，文档一旦发送到其他人或者其他电脑，图片的链接就会失效，导致 Markdown 文章中的图片无法显示。

为了解决这个问题，图片的地址就需要是网络上而不能是本地电脑的链接地址。如果我们将图片存储到图床服务器中，那么我们既能在 Markdown 中使用图片的网络链接地址，又能管理图片，后面写其它文章时还可以复用图片链接。

本文就来介绍一下在腾讯云轻量应用服务器上使用 Chevereto 搭建个人图床，同时利用 PicGo 和 Typora 自动在 Markdown 中将本地图片上传到图床中，以此来解决 Markdown 文章在更换电脑后图片地址失效的问题，进而打造一个沉浸式 Markdown 写作环境，专注于写作。

环境准备

  • 腾讯云轻量应用服务器：使用 Docker 应用镜像并安装 docker-compose
  • Chevereto：自建图床程序，使用 docker-compose 来安装
  • PicGo：图床管理工具，安装 chevereto 插件
  • Typora：Markdown 编辑器

服务器准备

首先在腾讯云官网购买一台轻量应用服务器，选择 Docker 镜像，这样我们只需安装 docker-compose。

代码语言：javascript复制
sudo curl -L "https://github.com/docker/compose/releases/download/1.27.3/docker-compose-$(uname -s)-$(uname -m)" -o /usr/local/bin/docker-compose

下载最新版Docker Compose

代码语言：javascript复制
sudo chmod  x /usr/local/bin/docker-composesudo ln -s /usr/local/bin/docker-compose /usr/bin/docker-compose

为docker-compose文件添加可执行属性并增加软连接

代码语言：javascript复制
docker-compose -v

查看docker-compose版本

搭建Chevereto图床

接下来我们在轻量应用服务器上搭建 Chevereto 图床。

创建 Chevereto 相关目录：

代码语言：javascript复制
mkdir -p /data/cheveretomkdir -p /data/chevereto/databasemkdir -p /data/chevereto/chevereto_images mkdir -p /data/chevereto/conf# 修改相关目录属性，防止chevereto启动时无法写入chmod 777 /data/chevereto/databasechmod 777 /data/chevereto/chevereto_images chmod 777 /data/chevereto/confcd /data/chevereto

创建 docker-compose.yaml 文件：

在/data/chevereto目录中创建 docker-compose.yaml 文件，内容如下：

代码语言：javascript复制
version: '3'
services:  db:    image: mariadb    volumes:      - ./database:/var/lib/mysql:rw    restart: always    networks:      - private    environment:      MYSQL_ROOT_PASSWORD: chevereto_root      MYSQL_DATABASE: chevereto      MYSQL_USER: chevereto      MYSQL_PASSWORD: chevereto
  chevereto:    depends_on:      - db    image: nmtan/chevereto    restart: always    networks:      - private    environment:      CHEVERETO_DB_HOST: db      CHEVERETO_DB_USERNAME: chevereto      CHEVERETO_DB_PASSWORD: chevereto      CHEVERETO_DB_NAME: chevereto      CHEVERETO_DB_PREFIX: chv_    volumes:      - ./chevereto_images:/var/www/html/images:rw      - ./conf/php.ini:/usr/local/etc/php/conf.d/php.ini    ports:      - 80:80
networks:  private:

创建php配置文件：在/data/chevereto/conf目录中创建php.ini配置文件， 配置最大使用内存和最大上传的图片大小等属性。内容如下：

代码语言：javascript复制
max_execution_time = 60;memory_limit = 1024M;upload_max_filesize = 256M;post_max_size = 256M;
代码语言：javascript复制
docker-compose up -d

启动Chevereto

配置Chevereto

在浏览器里访问轻量应用服务器的IP，会打开 chevereto 首次安装后的配置页面，输入相关信息后，点击「Install Chevereto」按钮。

出现下图就表示已经安装成功了，然后点击「admin dashboard」进入管理页面。

登录以后我们要获取 Chevereto 的API key：在Dashboard->Settings->Website->API

这里我们要获取 API v1 key，用来在 PicGo 中配置 Chevereto 插件，使得 PicGo 能够直接将图片上传到 Chevereto 中。下文在 PicGo 的配置过程中会详细介绍。

安装配置PicGo

安装PicGo

PicGo 是一款将图片上传到图床的图床管理工具。我们根据操作系统下载稳定版即可，这里下载的是 v2.2.2 Windows 版本的二进制文件。下载完毕后双击 PicGo-Setup-2.2.2.exe 文件安装即可。「点击获取下载地址」

安装Chevereto插件

打开 PicGo 后，在插件设置中搜索 Chevereto 安装即可。

配置Chevereto Uploader设置

这里我们要配置Chevereto上传的Url（Url为http://ip/api/1/upload）和之前在 chevereto Dashboard 中获取到的 API v1 key。这样 PicGo 就可以自动将图片上传到 Chevereto 了。

配置PicGo开启时间戳重命名

在 PicGo 设置中开启时间戳重命名，防止多次上传相同文件报错。同时我们取消其它不使用的图床，只显示 Chevereto Uploader。

配置PicGo-Server监听端口

这里我们将监听端口设置为36677，防止 Typora 上传图片时失败。因为 Typora 中使用了此端口号。

上传文件

配置好之后，我们直接将图片拖入到 PicGo 的上传区。

接下来我们到 Chevereto 的页面上可以查看刚才上传的图片。如下图所示，表明 PicGo 已经将图片上传成功了。

安装配置Typora

安装Typora

根据操作系统从 Typora 官网下载相应的安装包，这里我们下载 Windows 的安装包。文件下载完成后，双击安装即可。

配置图像上传

在 Typora 文件->偏好设置->图像中，我们进行配置。插入图片时，选择 「上传图片」；上传服务设定，选择「PicGo(app)」；PicGo 路径设为 PicGo 软件的安装路径。

开始沉浸式写作吧！

经过前面的配置，我们已经搭建好这一整套 Markdown 环境，那我们马上来体验一下吧！

打开 Typora，我们写一篇文章，向其中插入图片，我们会发现图片地址已经自动被替换为 Chevereto 图床上的网络地址了。这样当我们将 Markdown 文档发送给其他人或者在其他电脑中打开时，我们的图片就再也不会显示失败了。

参考资料

  • 腾讯云轻量应用服务器
  • Docker compose 安装
  • Chevereto 官网
  • Chevereto duckerhub
  • PicGo 官网
  • Typora 官网

推荐阅读

新闻｜腾讯与清华大学物理系签署合作备忘录，探索材料计算新领域

markdown 轻量应用服务器 容器 容器镜像服务 api

0 人点赞