# 安裝vscode & 套件

- Auto Close Tag
- Auto Rename Tag
- Bracket Pair Colorizer
- Chinese (Traditional) Language Pack for Visual Studio Code
- Chinese Lorem
- ==ESLint==
- Fake Image Snippet Collection (假圖快捷)
- Highlight Matching Tag (點擊tag時,highlight出跟他一對的tag)
- IntelliSense for CSS class names in HTML(在html提示class)
- ==JavaScript (ES6) code snippets==
- Live Server(一般網頁 dev server)
- Monokai Pro (theme)
- es6-string-html
- Path Intellisense (提示路徑下有的檔案)
- Image preview (預覽照片)

## line 機器人
- Visual Studio IntelliCode
- DotENV

## vue.js
- Vetur
- ==Vue Language Features (Volar)==
- vue cli
- language-stylus
- ==indent-rainbow== (用顏色顯示空白縮排)
- ==html2pug==
- pug to html

## debug用
- live share(開始共同作業>github登入)

## 手機螢幕共享
- Vysor

## vscode多視窗不同顏色
- peacock

## one-page-web
- cdnjs

## mongoDB 套件
- Azure Databases (可編輯)
- Azure Account

## sass 套件
- Sass
- Live Sass Compiler

## 用 github 儲存 vscode 套件的工具
- Settings Sync
- 需要 github token
- 在其他地方需要載新的vscode時，用這個套件可以一次下載平常用的所有套件
- [教學](https://medium.com/%E4%B8%80%E5%80%8B%E5%B0%8F%E5%B0%8F%E5%B7%A5%E7%A8%8B%E5%B8%AB%E7%9A%84%E9%9A%A8%E6%89%8B%E7%AD%86%E8%A8%98/vscode-%E4%BD%BF%E7%94%A8-settings-sync-%E5%90%8C%E6%AD%A5-vscode-%E7%9A%84%E6%93%B4%E5%85%85%E5%8A%9F%E8%83%BD%E8%88%87%E5%90%84%E9%A0%85%E8%A8%AD%E5%AE%9A-bb24a8d141eb)

## 其他設定
- ctrl+滾輪可以放大 >>

- 存檔時，自動排版

- 顯示出空了幾格