跳至主要內容

我的vscode代码片段及插件

yanggenjie2024年11月10日大约 2 分钟

1.代码片段

markdown 的代码片段

{
	"code block": {
		"prefix": "#cb",
		"body": [
			"```",
			"",
			"```",
		],
		"description": "code block"
	},
	"read more": {
		"prefix": "#mr",
		"body": [
			"",
			"<!-- more -->",
			"",
		],
		"description": "code block"
	},
	"include": {
		"prefix": "#include",
		"body": [
			"",
			"<!-- @include: ./file -->",
			"",
		],
		"description": "code block"
	},
	"frontMatter": {
		"prefix": "#fr",
		"body": [
			"---",
			"title: $TM_FILENAME_BASE",
			"date: $CURRENT_YEAR-$CURRENT_MONTH-$CURRENT_DATE $CURRENT_HOUR:$CURRENT_MINUTE:$CURRENT_SECOND",
			"article: false",
			"permalinkPattern: /$RELATIVE_FILEPATH/$RANDOM_HEX$RANDOM.html",
			"---",
			""
		],
		"description": "code block"
	},
	"random": {
		"prefix": "#now",
		"body": [
			"permalinkPattern: /blog/$RANDOM_HEX$RANDOM.html",
		],
		"description": "code block"
	}
}

写 vuepress 的博客，用的都是 markdown，需要在头部写这个文件的 metadata，每次都手动写，有点麻烦，写成代码片段之后，在 markdown 文件编辑的时候，只需要输入#fr，然后按 tab 键，就会自动生成如下代码：

---
title: 我的vscode配置
date: 2024-11-10 15:31:22
article: false
## permalinkPattern: :year/:month/:day/faad5d799138.html
---

title 和 date 都是自动生成的，title 会自动读取当前文件的文件名，date 会自动写成当前日期。然后永久链接也会自动生成一个随机数这个简化了很多工作。

更多代码片段相关： https://code.visualstudio.com/docs/editor/userdefinedsnippets

2. 插件

## 列出所有vscode插件
code --list-extensions

## 安装插件
code --install-extension 插件名

插件介绍

1. Remote - SSH

  • Name: Remote - SSH
  • Id: ms-vscode-remote.remote-ssh
  • Description: Open any folder on a remote machine using SSH and take advantage of VS Code's full feature set.
  • Version: 0.115.0
  • Publisher: Microsoft
  • VS Marketplace Link: https://marketplace.visualstudio.com/items?itemName=ms-vscode-remote.remote-ssh

远程 SSH 连服务器必备。

2. Markdown Image

  • Name: Markdown Image
  • Id: hancel.markdown-image
  • Description: Easy to insert a image to markdown
  • Version: 1.1.43
  • Publisher: Hancel.Lin
  • VS Marketplace Link: https://marketplace.visualstudio.com/items?itemName=hancel.markdown-image

markdown 插复制粘贴插入图片的时候，可以指定图片的相对路径，以及重命名文件名。

3. C#、C++、python 语言相应的插件

这个不多介绍了，搜索语言的关键词，安装就行，比如搜索 C#，就会搜到c#、c## Dev Kit等等，这些都安装就行。

4. Jupyter、Polyglot Notebooks

在 vs 中使用 jupyter 记笔记。Polyglot Notebooks是支持 C#代码的 Jupyter

python 代码格式化

  1. autopep8

    • Name: autopep8
    • Id: ms-python.autopep8
    • Description: Formatting support for Python files using the autopep8 formatter.
    • Version: 2024.0.0
    • Publisher: Microsoft
    • VS Marketplace Link: https://marketplace.visualstudio.com/items?itemName=ms-python.autopep8

  2. Black

    • Name: Black
    • Id: mikoz.black-py
    • Description: Format Python code with black.
    • Version: 1.0.3
    • Publisher: mikoz
    • VS Marketplace Link: https://marketplace.visualstudio.com/items?itemName=mikoz.black-py

通用的代码格式化工具

Prettier - Code formatter

  • Name: Prettier - Code formatter
  • Id: esbenp.prettier-vscode
  • Description: Code formatter using prettier
  • Version: 11.0.0
  • Publisher: Prettier
  • VS Marketplace Link: https://marketplace.visualstudio.com/items?itemName=esbenp.prettier-vscode

插件批量导出，导入

我的插件列表

adpyke.vscode-sql-formatter
azemoh.one-monokai
csharpier.csharpier-vscode
dotjoshjohnson.xml
esbenp.prettier-vscode
foxundermoon.shell-format
github.github-vscode-theme
hancel.markdown-image
inferrinizzard.prettier-sql-vscode
ionide.ionide-fsharp
mikoz.black-py
ms-dotnettools.csdevkit
ms-dotnettools.csharp
ms-dotnettools.dotnet-interactive-vscode
ms-dotnettools.dotnet-maui
ms-dotnettools.vscode-dotnet-runtime
ms-python.autopep8
ms-python.debugpy
ms-python.python
ms-python.vscode-pylance
ms-toolsai.jupyter
ms-toolsai.jupyter-keymap
ms-toolsai.jupyter-renderers
ms-toolsai.vscode-jupyter-cell-tags
ms-toolsai.vscode-jupyter-slideshow
ms-vscode-remote.remote-ssh
ms-vscode-remote.remote-ssh-edit
ms-vscode.cmake-tools
ms-vscode.cpptools-themes
ms-vscode.remote-explorer
prateekmahendrakar.prettyxml
redhat.vscode-xml
redhat.vscode-yaml
shakram02.bash-beautify
simonsiefke.prettier-vscode
twxs.cmake
yzhang.markdown-all-in-one

批量安装

把上面的内容写成 txt 文件，如存放在 extensions.txt，打开 powershell,执行一下命令

Get-Content extensions.txt | ForEach-Object { code --install-extension $_ }