Visual Studio Code -- 插件篇

Visual Studio Code -- 插件篇

@(blog-)


目录

[TOC]


前端通用

View In Browser

View In Browser

  • 功能
    • 预览HTML页面
  • 使用说明
    • 安装之后,在 html 文件中按 Ctrl+F1

HTML Snippets

HTML Snippets

  • 功能
    • HTML代码提示
  • 演示
    • Visual Studio Code -- 插件篇_第1张图片

HTML CSS Class Completion

HTML CSS Class Completion

  • 功能
    • 扫描项目中的所有css中的class名,在html中自动补全,安装后每次打开自动启用。
    • 注意:如果css过多容易卡死。
  • 演示

HTML CSS Support

HTML CSS Support

  • 功能
    • 增加 .html 中css的代码补全,可以手动增加配置文件来增加外部css中的class补全。
    • 这个和上一个的功能差不多,推荐使用这个
  • 演示
    • Visual Studio Code -- 插件篇_第2张图片

Path Autocomplete

Path Autocomplete

  • 功能
    • 路径自动补齐
  • 演示

Auto Rename Tag

Auto Rename Tag

  • 功能
    • 自动同步修改标签
  • 演示

Debugger for Chrome

Debugger for Chrome

  • 功能
    • 集合Chrome进行调试

beautify

beautify

  • 功能
    • 格式化代码

微信小程序

vscode-wechat

vscode-wechat

  • 功能
    • 用vscode开发微信小程序
    • 支持 wxmlwxss 语法高亮
    • 页面预览
  • 使用说明
    • 启动项目后按 Ctrl + f8 就可以开启预览功能

颜值控

Material-theme

Material-theme

  • 功能
    • 一个挺好看的代码高亮主题。
  • 演示
    • Visual Studio Code -- 插件篇_第3张图片

vscode-icons

vscode-icons

  • 功能
    • 侧栏的图标
  • 使用说明
    • 安装之后,按下图进行操作:
    • Visual Studio Code -- 插件篇_第4张图片
  • 演示
    • Visual Studio Code -- 插件篇_第5张图片

background

vscode-background

  • 功能
    • 一个萌萌的插件,可以自己设置vsc的背景图。
    • 备注:安装之后,卸载,还是更换了背景图。
  • 演示

你可能感兴趣的:(Visual Studio Code -- 插件篇)