編輯器IDE之VSCode

不少時候面臨換項目組，公司內部換等等，須要清除以前的權限，電腦更換等... 確實很煩人，因此記錄也是給本身下次更加快速方便的使用

插件安裝

我的經常使用的一些插件，發現好用的會更新

插件名	功能
vscode-fileheader	文件頭部信息
ESLint	代碼校驗工具
Auto Close Tag	自動閉合標籤
Auto Rename Tag	修改HTML標籤時，自動修改匹配的標籤
TODO Highlight	toDo高亮
Bracket Pair Colorizer	用不一樣顏色高亮顯示匹配的括號
vetur	vue代碼提示插件
vscode-icons	文件圖標
One Dark Pro	vscode主題

vscode eslint 配置

1. vscode 下載eslint插件
2. npm install -g eslint 全局安裝eslint
3. vscode 用戶設置配置 (settings.json)

{
  //爲了符合eslint的兩個空格間隔原則 
  "editor.tabSize": 2,
  //使用eslint規則從新格式化代碼
  "eslint.autoFixOnSave": true,
  //關閉自動文件自動存儲
  "files.autoSave": "off",
  "eslint.validate": [
    "javascript",
    {
      "language": "vue",
      "autoFix": true
    },
    "html",
    "vue"
  ]
}

1. 項目中有eslint的配置文件 便可用eslint的基本配置

setting.json

部分setting設置

{
  "workbench.iconTheme": "vscode-icons",
  "workbench.colorTheme": "One Dark Pro",
  "explorer.confirmDelete": false,
  //爲了符合eslint的兩個空格間隔原則 
  "editor.tabSize": 2,
  //使用eslint規則從新格式化代碼
  "eslint.autoFixOnSave": true,
  //關閉自動文件自動存儲
  "files.autoSave": "off",
  "eslint.validate": [
    "javascript",
    {
      "language": "vue",
      "autoFix": true
    },
    "html",
    "vue"
  ],
  "fileheader.Author": "xiaoxuehe",
  "fileheader.LastModifiedBy": "xiaoxuehe",
  "todohighlight.isEnable": true,
}

問題記錄

左側活動欄

左邊活動欄搜索按鈕沒了，文件->首選項->設置

// 控制搜索功能顯示在側邊欄仍是水平空間更大的面板區域
  "search.location": "sidebar",