前言

此為將開發環境轉移至 Macbook Pro 的 macOS Mojave 10.14.6 版作業系統時使用的設定與套件文檔。

使用方法

複製 setting,找到設定右上的小圖示開啟 JSON 格式的設定,貼上並儲存即可。 另存一個 extensions.json 檔,並存進 .vscode 名稱的資料夾,之後拉到 VSCode 左側的工作區,之後到擴充應用區挑要用到的套件。

setting.json

{
  /* 編輯器內建功能設定 */
  "editor.multiCursorModifier": "ctrlCmd", // 按著Ctrl並點擊不同位置進行多選
  "editor.snippetSuggestions": "top", // 輸入時,自動format,調整格式
  "editor.formatOnPaste": false, // 貼上時,自動format,調整格式
  "editor.formatOnSave": false, // 存檔時,自動format,調整格式
  "editor.wordWrap": "on", // 單行過長時,換行顯示而不是顯示ScrollBar
  "editor.fontFamily": "Operator Mono, Menlo, Monaco, 'Courier New', monospace", // 編輯器字體
  "editor.fontSize": 18, // 字體大小
  "editor.tabSize": 2, // 一個tab等於兩個space
  "editor.rulers": [80, 120], // 在80~120字的地方畫線提醒字數不要太多
  "editor.fontLigatures": true, // 字體緊密
  "window.zoomLevel": -1, // 縮放比例
  "explorer.confirmDelete": false, // 在目錄刪除檔案時,是否需要再次確認
  "workbench.startupEditor": "newUntitledFile", // IDE啟動時,目錄無工作項目則自動開新空白文件
  "extensions.ignoreRecommendations": false, // 延伸套件的通知是否不再顯示
  "emmet.triggerExpansionOnTab": true, // 固定開啟,必定展開Emmet縮寫
  "emmet.syntaxProfiles": {
    "javascript": "html", // 在javascript裡可以使用html的相關設定,如Emmet
    "vue": "html"
  },
  "emmet.includeLanguages": {
    "blade": "html", // 在不支援某些語法的檔名裡加入特定語言支持
    "vue": "html"
  },
  // bracketPairColor 套件併入原生設定
  "editor.bracketPairColorization.enabled": true,
  "editor.guides.bracketPairs": "active",
  "terminal.external.osxExec": "iTerm.app", // 終端使用iterm2
  "terminal.integrated.defaultProfile.osx": "zsh", // 終端使用zsh介面
  "terminal.integrated.fontFamily": "SauceCodePro Nerd Font", // 終端字體
  "terminal.integrated.cursorStyle": "underline", // 終端目前位置用底線表示
  "terminal.integrated.cursorBlinking": true, // 終端目前位置閃爍
  "php.suggest.basic": false, // 停用VSCode內建提示
  /* 外掛相關設定 */
  "liveServer.settings.donotShowInfoMsg": true, // IDE主題
  "vetur.format.styleInitialIndent": true, // 讓vue檔<style>裡的第一行縮排
  "vetur.format.scriptInitialIndent": true,
  "workbench.iconTheme": "vscode-icons",
  "editor.suggestSelection": "first",
  "vsintellicode.modify.editor.suggestSelection": "automaticallyOverrodeDefaultValue",
  "workbench.colorTheme": "One Dark Pro",
  "tabnine.experimentalAutoImports": true,
  "[jsonc]": {
    "editor.defaultFormatter": "esbenp.prettier-vscode"
  },
  "[vue]": {
    "editor.defaultFormatter": "esbenp.prettier-vscode"
  },
  "[markdown]": {
    "editor.defaultFormatter": "yzhang.markdown-all-in-one"
  }
}

extensions.json

{
  "recommendations": [
    "formulahendry.auto-rename-tag",
    "ms-ceintl.vscode-language-pack-zh-hant",
    "editorconfig.editorconfig",
    "dsznajder.es7-react-js-snippets",
    "dbaeumer.vscode-eslint",
    "donjayamanne.githistory",
    "oderwat.indent-rainbow",
    "onecentlin.laravel-extension-pack",
    "ritwickdey.liveserver",
    "zhuangtongfa.material-theme",
    "christian-kohler.path-intellisense",
    "octref.vetur",
    "visualstudioexptteam.vscodeintellicode",
    "robertohuertasm.vscode-icons",
    "esbenp.prettier-vscode",
    "tabnine.tabnine-vscode"
  ]
}