前端►前端框架►Hexo

Hexo 博客编写教程

参考

安装Hexo

  1. 安装Node.js Git
  2. nodejs 安装 Hexo npm install -g hexo-cli

Hexo使用

初始化项目

  1. 创建博客项目 hexo init blog
  2. 进入项目目录 cd blog
  3. 安装依赖包 npm install

运行项目

  1. 运行 hexo g 生成静态页面
  2. 运行 hexo server 运行服务器
  3. 就可以本地访问 http://localhost:4000/ 查看博客了

写作

  • 本地文档引用
    1
    2
    3
    {% post_link [filename] %}
    比如markdown[Windows10电脑清理](./Windows10电脑清理.md) 
    在Hexo应该 {% post_link Windows10电脑清理 %} 这么写

项目结构

1
2
3
4
5
6
7
8
9
.
├── _config.yml # 网站的配置文件。 您可以在此配置大部分的参数。
├── package.json    # 应用程序的信息
├── public  # 静态页面文件夹。
├── scaffolds   # 模版 文件夹。 
├── source  资源文件夹。 是存放用户资源的地方。
|   ├── _drafts
|   └── _posts #  除 _posts 文件夹之外，_ 开头文件/文件夹被隐藏
└── themes  # 主题 文件夹。 Hexo 会根据主题来生成静态页面。

使用Nginx反向代理

  1. 安装nginx
    1
    2
    3
    4
    5
    6
    7
    8
    9
    10
    11
    version: '3.8'
    services:
      nginx:
        image: nginx:1.27.3
        container_name: nginx
        ports:
          - "80:80"
          # - "4443:443"
        volumes:
          - E:/datum/知识库/计算机技术/docker/compose-nginx/nginx/conf.d/default.conf:/etc/nginx/conf.d/default.conf:ro
          - /usr/share/nginx/html/:/usr/share/nginx/html/
  2. 配置nginx 例如: 
    1
    2
    3
    4
    5
    6
    7
    8
    9
    10
    11
    12
    13
    14
    15
    16
    17
    18
    19
    # /etc/nginx/conf.d/default.conf 一般nginx配置在这个位置
    server {
        # 监听80端口
        listen 80;
        # 如果没有域名，可以省略 server_name 指令
        # 或者直接指定服务器的公网IP地址
        # server_name your-public-ip;

        location / {
            # 指定静态页面的根目录
            root /usr/share/nginx/html; 
            index index.html;
            try_files $uri $uri/ @rewrites;
        }

        location @rewrites {
            rewrite ^(.+)$ /index.html last;
        }
    }