VitePress 部署上线

vitepress 快速入门

vitepress 深入学习

vitepress 部署上线

vitepress 入门教程

vitepress 入门到精通

vitepress 从0到1开始

vitepress 实战教程

一、VitePress Docker Nginx 配置

1. 检查你的 docker compose 环境

bash

docker --version

bash

docker compose version

日志信息：

powershell

PS C:\Users\Administrator\Documents\vite-docs> docker --version
Docker version 26.0.0, build 2ae903e
PS C:\Users\Administrator\Documents\vite-docs> docker compose version
Docker Compose version v2.26.1-desktop.1
PS C:\Users\Administrator\Documents\vite-docs>

如果需要安装、或者拉取镜像失败可以看看这篇文章

解决 docker 无法安装和拉取镜像问题

登录云服务器，当然如果你没有域名，那么你可以使用 ip 登录 ssh root@your_server_ip

powershell

PS C:\Users\Administrator\Documents\mycode\aly_nginx> ssh root@ffffee.com
root@ffffee.com's password:
Last failed login: Sun Sep  1 20:24:52 CST 2024 from xxx on ssh:notty
There were 5 failed login attempts since the last successful login.
Last login: Sun Sep  1 18:12:57 2024 from xxx
[root@VM-20-6-centos ~]#

创建存放代码的目录/home/ffffee.com/

bash

[root@VM-20-6-centos ~]# mkdir -p /home/ffffee.com/

克隆仓库到指定的目录 /home/ffffee.com/ 目录

bash

[root@VM-20-6-centos ~]# git clone git@gitee.com:fe521/ffffee.com.git /home/ffffee.com/
Cloning into '/home/ffffee.com'...
remote: Enumerating objects: 143, done.
remote: Counting objects: 100% (143/143), done.
remote: Compressing objects: 100% (124/124), done.
remote: Total 143 (delta 43), reused 54 (delta 10), pack-reused 0
Receiving objects: 100% (143/143), 12.35 MiB | 14.80 MiB/s, done.
Resolving deltas: 100% (43/43), done.

查看/home/ffffee.com/目录是否有代码

bash

[root@VM-20-6-centos ~]# ls /home/ffffee.com/
compose.yml  default.conf  deploy  Dockerfile  Jenkinsfile  nginx.conf  package.json  package-lock.json  public  README.md  src
[root@VM-20-6-centos ~]# cd /home/ffffee.com/
[root@VM-20-6-centos ffffee.com]#

2. 创建下面 5 个文件 docker compsoe 相关配置文件

compose.yml

yml

services:
  com_ffffee_frontend:
    build:
      context: .
      dockerfile: Dockerfile
    container_name: docs_com_ffffee
    networks:
      - net_com_ffffee
    # volumes:
    #   - ./dist:/usr/share/nginx/html
    ports:
      - 5555:80
networks:
  net_com_ffffee:

3. 执行 docker compose 命令一键构建部署

bash

docker compose up --build -d

docker compose up --build -d命令具体介绍

这个命令用于启动和管理由 Docker Compose 定义的多个容器化应用程序。

它会在后台启动并构建 Docker Compose 文件中定义的所有服务。具体而言，该命令的各个部分含义如下：

docker compose：这是 Docker Compose 的命令，用于管理和运行多个容器化应用程序。
up：启动 Docker Compose 定义的所有服务。如果这些容器还不存在，则会根据 compose.yml（旧版本为 docker-compose.yml）文件中定义的服务创建它们。
--build：在启动服务之前，先重新构建服务中定义的 Docker 镜像。如果代码或配置文件有更新，这个选项可以确保使用最新的构建版本。
-d：以后台模式（detached mode）运行容器。执行该命令后，终端会立即返回，而不阻塞进程。

总体而言，这个命令可以在后台自动构建和启动所有服务，适合一键式构建和部署场景。

dcoekr compose up --build -d运行成功的日志

powershell

PS C:\Users\Administrator\Desktop\ffffee> docker compose up --build -d
[+] Building 0.0s (0/0)  docker:default
[+] Building 52.4s (16/16) FINISHED                                                                                                                           docker:default
 => [com_ffffee_frontend internal] load build definition from Dockerfile                                                                                                0.0s
 => => transferring dockerfile: 572B                                                                                                                                    0.0s
 => [com_ffffee_frontend internal] load metadata for docker.io/lishaohai/nginx-brotli:1.25.4                                                                            2.8s
 => [com_ffffee_frontend internal] load metadata for docker.io/library/node:18                                                                                          4.4s
 => [com_ffffee_frontend internal] load .dockerignore                                                                                                                   0.0s
 => => transferring context: 178B                                                                                                                                       0.0s
 => [com_ffffee_frontend builder 1/6] FROM docker.io/library/node:18@sha256:a7ff16657263663c1e92ba3060cdbba0e77329a0a4cb3c27bbbbe90c6e20bd87                           40.7s
 => => resolve docker.io/library/node:18@sha256:a7ff16657263663c1e92ba3060cdbba0e77329a0a4cb3c27bbbbe90c6e20bd87                                                        0.0s
 => => sha256:3cbbe86a28c2f6b3c3e0e8c6dcfba369e1ea656cf8daf69be789e0fe2105982b 24.05MB / 24.05MB                                                                       13.1s
 => => sha256:a7ff16657263663c1e92ba3060cdbba0e77329a0a4cb3c27bbbbe90c6e20bd87 6.41kB / 6.41kB                                                                          0.0s
 => => sha256:cc722b58258b36bc4d845113d609fea1e2957f12118fccd2ffaede90f4c5e0c5 2.49kB / 2.49kB                                                                          0.0s
 => => sha256:45f07525ada0df5b873def96c54f0fbf2f3b823658fb03cc19a57add84228fe0 6.55kB / 6.55kB                                                                          0.0s
 => => sha256:903681d87777d28dc56866a07a2774c3fd5bf65fd734b24c9d0ecd9a13c9f636 49.55MB / 49.55MB                                                                        6.8s
 => => sha256:6ed93aa58a52c9abc1ee472f1ac74b73d3adcccc2c30744498fd5f14f3f5d22c 64.14MB / 64.14MB                                                                       31.4s
 => => extracting sha256:903681d87777d28dc56866a07a2774c3fd5bf65fd734b24c9d0ecd9a13c9f636                                                                               1.2s
 => => sha256:787c78da43830be6d988d34c7ee091f98d828516ce5478ca10a4933d655191bf 211.24MB / 211.24MB                                                                     36.0s
 => => sha256:a22bad3cc9773638be9a43d84179b40cccaf4e9486ad5e39af9d01457ae263d4 3.32kB / 3.32kB                                                                         14.1s
 => => extracting sha256:3cbbe86a28c2f6b3c3e0e8c6dcfba369e1ea656cf8daf69be789e0fe2105982b                                                                               0.3s
 => => sha256:d20a60ac17d1dee38a8af42da4f856eb0de0cec97a9663da6ab3ef0486773b19 45.64MB / 45.64MB                                                                       27.0s
 => => sha256:2c399ba7c34f7a16e5ba741bce21c63738721cd8dc2779ca546ef8f8621f9f12 1.25MB / 1.25MB                                                                         28.4s
 => => sha256:b5179ca6334f7879a0be737b4340614628d71037568286f081f235e4bff64beb 445B / 445B                                                                             29.0s
 => => extracting sha256:6ed93aa58a52c9abc1ee472f1ac74b73d3adcccc2c30744498fd5f14f3f5d22c                                                                               1.4s
 => => extracting sha256:787c78da43830be6d988d34c7ee091f98d828516ce5478ca10a4933d655191bf                                                                               3.3s
 => => extracting sha256:a22bad3cc9773638be9a43d84179b40cccaf4e9486ad5e39af9d01457ae263d4                                                                               0.0s
 => => extracting sha256:d20a60ac17d1dee38a8af42da4f856eb0de0cec97a9663da6ab3ef0486773b19                                                                               1.1s
 => => extracting sha256:2c399ba7c34f7a16e5ba741bce21c63738721cd8dc2779ca546ef8f8621f9f12                                                                               0.0s
 => => extracting sha256:b5179ca6334f7879a0be737b4340614628d71037568286f081f235e4bff64beb                                                                               0.0s
 => CACHED [com_ffffee_frontend stage-1 1/4] FROM docker.io/lishaohai/nginx-brotli:1.25.4@sha256:53decb3d31539cde84967a1f50cdc212f3dd8cbbdc11c6a8652a08a2334c4c72       0.0s
 => [com_ffffee_frontend internal] load build context                                                                                                                   7.6s
 => => transferring context: 462.12MB                                                                                                                                   7.6s
 => [com_ffffee_frontend stage-1 2/4] COPY ./default.conf /etc/nginx/conf.d/default.conf                                                                                0.3s
 => [com_ffffee_frontend stage-1 3/4] COPY ./nginx.conf /etc/nginx/nginx.conf                                                                                           0.0s
 => [com_ffffee_frontend builder 2/6] WORKDIR /app                                                                                                                      0.4s
 => [com_ffffee_frontend builder 3/6] COPY package.json package-lock.json /app/                                                                                         0.0s
 => [com_ffffee_frontend builder 4/6] RUN npm install --registry=https://registry.npmmirror.com                                                                         2.3s
 => [com_ffffee_frontend builder 5/6] COPY . /app                                                                                                                       0.4s
 => [com_ffffee_frontend builder 6/6] RUN npm run build                                                                                                                 3.3s
 => [com_ffffee_frontend stage-1 4/4] COPY --from=builder /app/dist /usr/share/nginx/html                                                                               0.3s
 => [com_ffffee_frontend] exporting to image                                                                                                                            0.3s
 => => exporting layers                                                                                                                                                 0.3s
 => => writing image sha256:8a0a4dd4d86bb38e43e5475632ee0a25a998c23638271795010c6fec345d5396                                                                            0.0s
 => => naming to docker.io/library/ffffee-com_ffffee_frontend                                                                                                           0.0s
[+] Running 2/2
 ✔ Network ffffee_net_com_ffffee  Created                                                                                                                               0.0s
 ✔ Container docs_com_ffffee      Started                                                                                                                               0.0s

4. 查看容器状态是否正常

bash

docker compose ps -a

powershell

PS C:\Users\Administrator\Desktop\ffffee> docker compose ps -a
NAME              IMAGE                        COMMAND                   SERVICE               CREATED          STATUS          PORTS
docs_com_ffffee   ffffee-com_ffffee_frontend   "/docker-entrypoint.…"   com_ffffee_frontend   18 seconds ago   Up 16 seconds   0.0.0.0:5555->80/tcp
PS C:\Users\Administrator\Desktop\ffffee>

访问本地预览效果：

http://localhost:5555

alt text

5. 停止 docker compose 服务

停止并移除容器和网络

bash

docker compose down

停止并移除容器和网络，同时删除未被标记的本地镜像

bash

docker compose down --rmi=local

docker compose down 命令解释

描述： 停止并移除容器、网络
用法： docker compose down [OPTIONS] [SERVICES]

描述：
停止容器并移除由 up 命令创建的容器、网络、卷和镜像。

默认情况下，只有以下内容会被移除：

Compose 文件中定义的服务的容器。
Compose 文件中 networks 部分定义的网络。
如果使用了默认网络，也会移除该网络。
定义为 external 的网络和卷不会被移除。

匿名卷不会默认移除。然而，由于它们没有固定的名称，因此不会被后续的 up 命令自动挂载。如果需要在更新之间保留数据，请使用显式路径作为绑定挂载或命名卷。

选项：

选项	默认值	描述
`--remove-orphans`		移除未在 `Compose` 文件中定义的服务的容器
`--rmi`		移除服务使用的镜像。 "local" 仅移除没有自定义标签的镜像 ("local"\|"all")
`-t, --timeout`		指定关闭超时时间（以秒为单位）
`-v, --volumes`		移除在 `Compose` 文件中 `volumes` 部分声明的命名卷和附加到容器的匿名卷

什么是未被标记的本地镜像？

“未被标记的本地镜像”是指没有指定标签（tag）的镜像。这些镜像通常是在构建或拉取镜像时未显式地给予特定标签而生成的。这些镜像在本地存在，但由于没有标签，很容易被新的镜像版本覆盖或被误认为是无用的，因此在某些清理操作中，通常会优先考虑移除它们。

标签（tag）通常用于标识镜像的版本或用途，例如 myapp:1.0 或 myapp:latest。未被标记的镜像则没有这种标识，默认情况下，它们可能以 <none>:<none> 的形式出现。

在使用 docker compose down --rmi=local 时，local 选项会删除这些没有自定义标签的本地镜像，以释放存储空间并避免积累无用的镜像。

二、VitePress shell 脚本方式构建部署

1. 环境配置

需要你有一台云服务器，最好是 CentOS 操作系统
可以通过 ssh 远程登录你的云服务器
安装 docker、docker compose，版本参考以下
安装 git、nodejs 环境

bash

[root@VM-20-6-centos ~]# docker --version
Docker version 20.10.21, build baeda1f
[root@VM-20-6-centos ~]# docker compose version
Docker Compose version v2.12.2
[root@VM-20-6-centos ~]# node --version
v16.15.0
[root@VM-20-6-centos ~]# git --version
git version 1.8.3.1
[root@VM-20-6-centos ~]#

2. shell 脚本工作流程

使用 ssh 登录云服务器
切换到云服务器的 /home/ffffee.com/目录
在云服务器执行 npm run deploy 命令

3. 编写自动化部署 deploy.sh（Windows 是 deploy.bat）脚本

以下是一个简单的 shell 脚本，用于登录云服务器并在特定目录下执行npm run deploy命令。

在使用此脚本前，请确保你已经配置了 SSH 免密登录，否则脚本在执行过程中会停下来等待你输入密码。

package.json 增加 release和 deploy 命令，具体如下：

json

{
  "scripts": {
    "start": "npm run dev",
    "dev": "vitepress dev",
    "build": "vitepress build",
    "preview": "vitepress preview",
    "release": "git push && node deploy/deploy.js", 
    "deploy": "git pull && docker compose up --build -d"
  }
}

3. 执行命令一键部署项目

bash

npm run release

可能出现以下错误：

powershell

PS C:\Users\Administrator\Desktop\ffffee.com> npm run release

> ffffee@1.0.0 release
> git push && node deploy/deploy.js

Everything up-to-date
(node:28432) Warning: To load an ES module, set "type": "module" in the package.json or use the .mjs extension.
(Use `node --trace-warnings ...` to show where the warning was created)
C:\Users\Administrator\Desktop\ffffee.com\deploy\deploy.js:1
import { execSync } from "child_process";
^^^^^^

SyntaxError: Cannot use import statement outside a module
    at internalCompileFunction (node:internal/vm:73:18)
    at wrapSafe (node:internal/modules/cjs/loader:1149:20)
    at Module._compile (node:internal/modules/cjs/loader:1190:27)
    at Module._extensions..js (node:internal/modules/cjs/loader:1280:10)
    at Module.load (node:internal/modules/cjs/loader:1089:32)
    at Module._load (node:internal/modules/cjs/loader:930:12)
    at Function.executeUserEntryPoint [as runMain] (node:internal/modules/run_main:81:12)
    at node:internal/main/run_main_module:23:47

Node.js v18.14.0
PS C:\Users\Administrator\Desktop\ffffee.com>

package.json 增加一个 "type": "module"

json

{
  "name": "ffffee",
  "version": "1.0.0",
  "description": "",
  "main": "index.js",
  "type": "module", 
  "scripts": {
    "start": "npm run dev",
    "dev": "vitepress dev",
    "build": "vitepress build",
    "preview": "vitepress preview",
    "release": "git push && node deploy/deploy.js",
    "deploy": "git pull && docker compose up --build -d"
  },
  "keywords": [],
  "author": "",
  "license": "ISC",
  "devDependencies": {
    "vite-plugin-compression": "^0.5.1",
    "vitepress": "^1.3.4"
  }
}

三、VitePress SEO 搜索引擎优化

1. VitePress 生成 sitemap

https://vitepress.dev/zh/guide/sitemap-generation

import { defineConfig } from "vitepress";

// https://vitepress.dev/reference/site-config
export default defineConfig({
  lang: "zh-Hans",
  sitemap: { 
    hostname: "https://ffffee.com", 
  }, 
});

2. 添加 robots.txt 文件

记得把下面https://ffffee.com换成你自己的

robots.txt

txt

User-agent: *
Disallow: /contact/

Sitemap: https://ffffee.com/sitemap.xml

3. 提交 sitemap 到 bing/百度/Google

前端 SEO ??前端如何进行 SEO 搜索引擎优化

四、robots.txt 文件详细解析

1. robots.txt 禁止爬虫爬取 /contact/路径下的页面

txt

User-agent: *
Disallow: /contact/

这个 robots.txt 文件的内容告诉搜索引擎的爬虫（如 Googlebot、Bingbot 等）如何爬取网站的内容。具体来说，这两行的含义如下：

User-agent: *：这行指定了针对所有爬虫的规则。星号（*）表示所有的搜索引擎爬虫都适用这些规则。
Disallow: /contact/：这行表示不允许爬虫访问 /contact/ 路径下的所有页面。也就是说，搜索引擎爬虫在爬取网站时，将不会访问或索引该路径下的内容。

所以，整个文件的意思是：禁止任何搜索引擎爬虫访问和索引网站中 /contact/ 路径下的页面内容。

2. 下面 robots.txt 是什么意思

获取抖音的 robots.txt 文件：https://www.douyin.com/robots.txt

抖音的 robots.txt 文件内容

txt

User-agent: Googlebot
User-agent: Bingbot
User-agent: DuckDuckBot
User-agent: Baiduspider
User-agent: 360Spider
User-agent: Sogouspider
User-agent: Yisouspider
User-agent: ByteSpider
User-agent: ToutiaoSpider
User-agent: Sogou web spider
User-agent: Sogou wap spider
User-agent: Sogou inst spider
User-agent: Sogou blog
User-agent: Sogou News Spider
User-agent: Sogou Orion Spider
User-agent: Sosospider
User-agent: Sogou spider2
User-agent: HaosouSpider
User-agent: HaosoSpider
Disallow: /follow
Disallow: /user/?enter_from=video_detail&from_gid=*
Disallow: /topic/

User-agent: Bingbot
Disallow: *modal_id*
User-agent: Baiduspider
Allow: /topic/

User-agent: *
Disallow: /

Sitemap: https://www.douyin.com/sitemap.xml

这个 robots.txt 文件内容包含了更详细的规则，针对不同的搜索引擎爬虫（User-agent）设定了不同的访问权限。

让我们逐步解释各部分的含义：

2.1 针对特定搜索引擎爬虫的规则

这段代码列出了多个搜索引擎爬虫（如 Googlebot、Bingbot、Baiduspider 等），并为它们设定了相同的访问限制。
Disallow: /follow：这些爬虫不能访问 /follow 目录下的内容。
Disallow: /user/?enter_from=video_detail&from_gid=*：这些爬虫不能访问 /user/ 路径下的包含特定查询参数（enter_from=video_detail 和 from_gid=）的 URL。
Disallow: /topic/：这些爬虫不能访问 /topic/ 目录下的内容。

2.2 针对特定搜索引擎的额外规则

Bingbot：
- Disallow: *modal_id*：禁止 Bingbot 爬取包含 modal_id 这个参数的所有 URL。
Baiduspider：
- Allow: /topic/：允许 Baiduspider 访问 /topic/ 目录下的内容。这一规则优先于前面的通用规则，对 Baiduspider 开放了 /topic/ 目录的访问。

2.3 针对所有爬虫的规则

User-agent: *：这行指定了适用于所有其他爬虫（不在前面列出的爬虫）。
Disallow: /：这行表示禁止所有其他爬虫访问整个网站。这意味着，除了前面特定列出的爬虫之外，其他所有爬虫都不能访问和索引网站的任何内容。

2.4 Sitemap 指令

Sitemap: https://www.douyin.com/sitemap.xml：这行告诉爬虫网站地图的位置。网站地图（sitemap）是一种包含了网站所有可供爬虫访问的页面的文件，帮助搜索引擎更有效地爬取和索引网站内容。

2.5 抖音 robots.txt 总结

该文件为特定的爬虫（如 Googlebot、Bingbot、Baiduspider 等）设定了不同的访问限制或许可。
它还设置了一个通用规则，禁止所有其他未明确列出的爬虫访问网站的任何内容。
同时提供了网站地图的路径，帮助爬虫了解网站结构。

快速实践指南

入门指南

基础知识

构建镜像

Node.js

Java

Dockerfile最佳实践

直播讲解 docker + nginx

咨询/接单/bug修复/学习交流群

VitePress 部署上线 ​

一、VitePress Docker Nginx 配置 ​

1. 检查你的 docker compose 环境 ​

2. 创建下面 5 个文件 docker compsoe 相关配置文件 ​

3. 执行 docker compose 命令一键构建部署 ​

4. 查看容器状态是否正常 ​

5. 停止 docker compose 服务 ​

二、VitePress shell 脚本方式构建部署 ​

1. 环境配置 ​

2. shell 脚本工作流程 ​

3. 编写自动化部署 deploy.sh（Windows 是 deploy.bat） 脚本 ​

3. 执行命令一键部署项目 ​

三、VitePress SEO 搜索引擎优化 ​

1. VitePress 生成 sitemap ​

2. 添加 robots.txt 文件 ​

3. 提交 sitemap 到 bing/百度/Google ​

四、robots.txt 文件详细解析 ​

1. robots.txt 禁止爬虫爬取 /contact/路径下的页面 ​

2. 下面 robots.txt 是什么意思 ​

2.1 针对特定搜索引擎爬虫的规则 ​

2.2 针对特定搜索引擎的额外规则 ​

2.3 针对所有爬虫的规则 ​

2.4 Sitemap 指令 ​

2.5 抖音 robots.txt 总结 ​

VitePress 部署上线

一、VitePress Docker Nginx 配置

1. 检查你的 docker compose 环境

2. 创建下面 5 个文件 docker compsoe 相关配置文件

3. 执行 docker compose 命令一键构建部署

4. 查看容器状态是否正常

5. 停止 docker compose 服务

二、VitePress shell 脚本方式构建部署

1. 环境配置

2. shell 脚本工作流程

3. 编写自动化部署 deploy.sh（Windows 是 deploy.bat）脚本

3. 执行命令一键部署项目

三、VitePress SEO 搜索引擎优化

1. VitePress 生成 sitemap

2. 添加 robots.txt 文件

3. 提交 sitemap 到 bing/百度/Google

四、robots.txt 文件详细解析

1. robots.txt 禁止爬虫爬取 /contact/路径下的页面

2. 下面 robots.txt 是什么意思

2.1 针对特定搜索引擎爬虫的规则

2.2 针对特定搜索引擎的额外规则

2.3 针对所有爬虫的规则

2.4 Sitemap 指令

2.5 抖音 robots.txt 总结