全栈指南

Appearance

插件 ​

vscode 编程中比较实用的插件推荐

汉化 ​

  • 搜索插件名称 chinese,会出现下图插件,点击安装即可

chinese

代码格式化 ​

安装插件 ​

  • 搜索插件名称 Prettier - Code formatter,会出现下图插件,点击安装即可

Prettier - Code formatter

配置规则 ​

typescript
export default {
	printWidth: 100, // 一行代码的最大字符数，超过最大值换行
	tabWidth: 2, // 缩进字节数
	useTabs: true, // 使用tab来缩进
	semi: true, // 句尾添加分号
	singleQuote: true, // 使用单引号代替双引号。
	bracketSpacing: true, //打印对象文字中括号之间的空格。
	embeddedLanguageFormatting: 'off', //永远不要自动格式化嵌入的代码。
};

忽略规则 ​

  • 有些文件不需要我们格式化,例如node_modules dist，所以需要配置对应的文件
  • 在项目根目录创建.gitignore文件配置规则
txt
/dist/*
/html/
.local
node_modules
**/*.svg
**/*.sh
/public/*

单词检查 ​

  • 搜索插件名称 Code Spell Checker,会出现下图插件,点击安装即可

Code Spell Checker

图片预览 ​

  • 搜索插件名称 Image preview,会出现下图插件,点击安装即可

Image preview

LeetCode ​

  • 搜索插件名称 LeetCode,会出现下图插件,点击安装即可

LeetCode

美化文件夹 ​

  • 搜索插件名称 vscode-icons,会出现下图插件,点击安装即可

vscode-icons

Docker ​

  • 搜索插件名称 docker,会出现下图插件,点击安装即可

docker

Git ​

Git Graph ​

  • git 分支管理工具
  • 搜索插件名称 Git Graph,会出现下图插件,点击安装即可

Git Graph

Git History ​

  • git 文件历史对比工具
  • 搜索插件名称 Git History,会出现下图插件,点击安装即可

Git History

Drawio ​

  • 可以用来画流程图
  • 搜索插件名称 Drawio,会出现下图插件,点击安装即可

Drawio

  • 使用方法：创建一个文件*.drawio,打开文件编辑即可