用Vim模板减少模板的数量(附代码示例)

273 阅读3分钟

如果你像我一样是个终端迷,你一定会喜欢这个。 今天我们将解释如何在没有任何插件的情况下避免编写模板代码。我们将要探讨的功能在Vim中被称为模板或骨架。

骷髅和维姆

不要害怕,骨架文件(或模板)只是普通文件。它们之所以被称为模板,是因为它们将在创建特定文件时被用作骨架。要创建一个JJSX TypeScript.tsx 文件,Vim可以使用一个预定义的模板(骨架)文件并添加一个React类。这看起来怎么样--你一定在问。让我们看看下面。

我们可以像这样在~/.vim/skeletons/react-typescript.tsx 里面定义一个骨架文件:

import React from "react"

interface Props {}

const NewComponent = (props: Props) => {
  return (
    <>
      <div></div>
    </>
  )
}

export default NewComponent

然后,我们可以在我们的.vimrc 中添加以下一行:

autocmd BufNewFile *.tsx 0r ~/.vim/skeletons/skeletons/typescript-react.tsx

让我们把它分解一下:

  • autocmd BufNewFile - 当我们试图在Vim中创建一个新文件时,运行以下内容
  • *.tsx - 这是你希望新文件匹配的模式
  • 0r - 从第0行开始读入缓冲区,即第一行
  • ~/.vim/skeletons/react-typescript.tsx - 将文件读入新文件

而且,就是这样。每次你创建一个新的React TypeScript文件,都会有一个新的功能组件坐镇。让我们看看还有哪些有用的模板可以使用。

有用的骨架

我在GitHub上的dotfiles中添加了几个骨架。 在那里,你可以使用你喜欢的东西。我也会在下面分享它们。

Bash脚本骨架

人们建议的最常见的模板是用于Bash脚本的模板,它可以是这样的:

#!/usr/bin/env bash

set -eou pipefail

你还需要在你的.vimrc 中加入以下一行:

autocmd BufNewFile *.sh 0r ~/.vim/skeletons/skeletons/script.sh

HTML骨架

我从2021年的HTML模板中摘取了这一条:

<!DOCTYPE html>
<html lang="en" class="no-js">
  <head>
    <meta charset="UTF-8" />
    <meta name="viewport" content="width=device-width" />

    <title>TODO</title>

    <meta name="description" content="Page description" />
    <meta property="og:title" content="Unique page title - My Site" />
    <meta property="og:description" content="Page description" />
    <meta
      property="og:image"
      content="https://pragmaticpineapple.com.com/image.jpg"
    />
    <meta property="og:image:alt" content="Image description" />
    <meta property="og:locale" content="en_US" />
    <meta property="og:type" content="website" />
    <meta name="twitter:card" content="summary_large_image" />
    <meta property="og:url" content="https://pragmaticpineapple.com.com/page" />
    <link rel="canonical" href="https://pragmaticpineapple.com.com/page" />

    <link rel="icon" href="/favicon.ico" />
    <link rel="icon" href="/favicon.svg" type="image/svg+xml" />
    <link rel="apple-touch-icon" href="/apple-touch-icon.png" />
    <link rel="manifest" href="/my.webmanifest" />

    <meta name="theme-color" content="#FF00FF" />
  </head>

  <body></body>
</html>

你可以在.vimrc 中添加下一行,在创建新的HTML文件时应用HTML模板:

autocmd BufNewFile *.html 0r ~/.vim/skeletons/skeletons/page.html

Blog Post Markdown Skeleton

下面这句话是我最喜欢的,因为我一直在研究如何为新的博客文章提供框架,看看吧:

---
title: TODO
description: TODO
slug: TODO
date: 2021-1-1
published: true
tags:
  - TODO
---

我确保这些文件只在content/blog 目录内创建,像这样:

autocmd BufNewFile *content/blog*.md 0r ~/.vim/skeletons/skeletons/blog-post.md

保存骨架的地方

如果当前部分被断章取义,我们可能会有麻烦。但是,玩笑归玩笑,你可以把模板文件存放在哪里?这其实并不重要。我把它们保存在我的dotfiles里面,我有版本控制。它们在~/Documents/dotfiles/skeletons 。有些人喜欢把它们放在~/.vim/templates~/.vim/skeletons 。我喜欢把它们放在dotfiles的git repo里,这样我可以很容易地修改和推送它们到GitHub。

手动使用

如果你不喜欢Vim在创建时自动填充你的文件,你总是可以采用手动方式。要简单地用另一个文件的内容填充一个文件,可以试试:read 命令:

:read ~/.vim/skeletons/react-typescript.tsx

~/.vim/skeletons/react-typescript.tsx 的内容将显示在你的光标下面。