从Typecho迁移到Eleventy

这个博客由 Typecho 提供支持将近 3 年后，它现在是一个使用 Eleventy 构建的静态生成的网站。

目前博客也不再是自己买云服务器托管了，它现在托管在 Cloudflare/Github 上，这个网站现在又给我省了一件事，那就是备份。

为什么选择 Eleventy？

在我第一次看到 Eleventy 是在 油油大佬 的博客。Eleventy 引起了我的兴趣，因为感觉它非常容易上手。根本不需要学习太多，文档简洁实用。基本上在搭建时，Eleventy 将解释 Markdown 文件并将它们转换为语义 html 文档。您可以在这些模板周围安装模板。

创建站点

现在第一件事就是生成一个没有数据的 Eleventy 的站点。

mkdir blog
cd blog
npm init -y
npm install @11ty/eleventy
code .

然后选择package.json这个文件，编辑一下scripts这个部分的，删除test那段代码，添加下面这段代码

"start": eleventy --serve

保存之后，打开终端，输入这段命令启动本地网页服务器

npm run start

之后打开浏览器在地址那输入 http://localhost:8080

你就会看到一段 Cannot GET / 然后再根目录新增一个新文件 index.md 里面写段

# hello world

切换到浏览器 刷新一下 如果出现下面这段话 太好了，说明一切正常！

在根目录再新建一个名为 eleventy.js 的文件 这是一个 11ty 的项目设定文件

src：存网页相关文件的文件夹

dist：输出静态html的文件夹

includes：存放主题模板的文件夹

module.exports = (eleventyConfig) => {
    return {
        dir: {
            input: 'src',
            output: 'dist',
            includes: '_includes'
        },
        markdownTemplateEngine: 'njk'
    }
}

在src文件夹下面再新增两个_includes和_data文件夹后

在_includes里再新增一个layouts的文件夹

在layouts文件夹新增一个名叫base.njk的文件（base.njk 可以说是一个主题模板）

_data文件夹是存放一些数据比如导航之类的

哦，对了不懂也可以看一下 Eleventy官方文档 ！

那我怎么写文章呢？

弄完上面这些操作后，在src里新增一个分类文件夹，我这里名为blog，这个文件夹是用来存放你写的md文章

---
layout: 'layouts/base.njk' 这里是引用模板
tags: blog
title: 文章名字
data: 日期
---

最后

Eleventy 大致就是这个样子，等你弄完所有东西，把dist目录下的文件上传到 Cloudflare/Github 上就大功告成了，为什么我不继续用 Typecho 呢？还不是因为没钱买云服务器，Typecho 也是一款轻量高效，稳定，简洁友好的一款博客程序。

但使用使用 Eleventy 搭建的网站可以让我很省心省钱，并拥有一个快速、轻量级的网站，使用起来还是和 Typecho 一样很愉快。