近期因轉換新工作的關係,順道體驗了在新電腦上架起原有的習慣的開發環境所需的軟體和設定。這邊筆記下相關的細節,以及用 Windows 和 Mac 的些許區別。
內容
VS Code 延伸套件 Extensions
– AutoFileName
– Babel JavaScript
– Code Runner
– Code Spell Checker
– Color Highlight
– CSS Peek
– ES7+ React/Redux/React-Native snippets
– ESLint
– Git Graph
– Github Copilot
– Github Copilot Chat
– JavaScript (ES6) code snippets
– Live Sass Compiler
– Markdown Preview Enhanced
– Preview on Web Server
– SCSS Formatter
– Stylelint
– SVG
– UnoCSS
– Vetur
– vscode-icons
– Tailwind CSS IntelliSense
– Vue – Official
– Vue VSCode Snippets
VS Code User settings
這點請依照個人的情況作調整
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 50 51 52 53 54 55 56 57 58 59 60 61 62 63 64 65 66 67 68 |
{ "editor.tabSize": 4, "editor.wordWrap": "on", "editor.formatOnPaste": true, "javascript.updateImportsOnFileMove.enabled": "always", "typescript.updateImportsOnFileMove.enabled": "always", "diffEditor.ignoreTrimWhitespace": false, "workbench.colorTheme": "Default Dark+", "workbench.startupEditor": "none", "workbench.iconTheme": "vscode-icons", "emmet.includeLanguages": { "vue-html":"html", "vue":"html" }, "editor.formatOnSave": false, "editor.codeActionsOnSave": { "source.fixAll.eslint": "explicit", "source.fixAll.stylelint": "explicit" }, "eslint.validate": [ "javascript", "javascriptreact", "typescript", "typescriptreact", "vue" ], "css.validate": false, "less.validate": false, "scss.validate": false, "vetur.validation.template": false, "extensions.ignoreRecommendations": true, "files.watcherExclude": { "**/.git/objects/**": true, "**/.git/subtree-cache/**": true, "**/node_modules/*/**": true, "**/.hg/store/**": true, "**/bin/*/**": true, "**/obj/*/**": true, "**/wwwroot/*/**": true }, "vsicons.dontShowNewVersionMessage": true, "git.mergeEditor": false, "update.showReleaseNotes": false, "[css]": { "editor.defaultFormatter": "stylelint.vscode-stylelint" }, "editor.inlineSuggest.enabled": true, "git.openRepositoryInParentFolders": "never", "terminal.integrated.defaultProfile.windows": "GitBash" "terminal.integrated.profiles.windows": { "PowerShell": { "source": "PowerShell", "icon": "terminal-powershell" }, "Command Prompt": { "path": [ "${env:windir}\\Sysnative\\cmd.exe", "${env:windir}\\System32\\cmd.exe" ], "args": [], "icon": "terminal-cmd" }, "GitBash": { "path": "C:\\Program Files (x86)\\Git\\bin\\bash.exe", "icon": "terminal-bash" } }, } |
NPM & Git
Windows 用 nvm-windows 和 Git for Windows
Mac 用 Homebrew 安裝 git 和 nvm 即可
Docker
Windows 用 Docker-Desktop
Mac 用 OrbStack 更為快速
Terminal & SSH Key
Windows
1. 用 oh-my-posh 美化 Git bash
2. Create SSH key in Windows 11
Mac
1. 讓 macOS 的 Terminal 又潮又實用:手把手設定教學 iTerm2 + oh-my-zsh + Powerlevel10k
2. [筆記] 管理 Mac 上的 SSH 設定檔,並用其抓取 Github 專案