厚顏無恥的 引一下流

19.05.03 Update Vscode 配置攻略（都是血和淚換來的）

上一篇講了很多 Mac 中配置的小技巧如何給碼農 ?????? 的 Mac 開光

時隔半年，再來詐屍更新一下開光 ?? 系列。

每次當我們看到 dalaos 寫的教程時候，雖然一條條都列的很詳細了，但實際操作起來還是困難重重。

有沒有一種更舒適的方式讓我們更容易的獲得教程中所搭建的環境。

對於博主來說，除了上述原因之外，主要是遇到一個很現實的問題，

一開始你可能只是一個實驗室的小磚工

你手上的機子可能還是要去排隊才能輪的上的 沒有可以持久使用的機子，肯定不會去想要不要給伺服器配一下 zsh, 讓大家登機子上去好用一點 （這個業務場景不考慮做一些內部使用的系統，提升用戶體驗，不存在的） 直到有一天 （當然這一天很可能不存在），大老闆 看你骨骼清奇，說給你 5 張 V100 用一下 你喜出望外，一臉色眯眯，等想著自己是不是要給伺服器整一套好用的環境 但是 一個星期過去了，你發現你還在配環境（當然 周報有東西寫 是好事情 hhh）

有時候，一件事做幾次可能會挺有收穫的，但一旦重複次數多了，只剩下厭倦了。

而作為一個 zsh 深度用戶，在白板 linux 上敲命令總感覺少了些什麼

zsh.sh就是為瞭解決這個問題，也為了方便新手能容易的配置之前教程中說明的環境

  • 如果你手上有一些機器，或者正準備遷移自己的伺服器
  • 如果你苦於繁瑣的配置過程，害怕配置中遇到 bug
  • 如果你不喜歡白板 shell 界面，習慣於 zsh 環境

歡迎使用zsh.sh

  • 目前支持 Ubuntu, CentOS, MacOSX 三個發行版
  • 支持 amb64(64bit) & i386 (32bit)
  • 支持 Docker 部署，Ubuntu, Ubuntu32, CentOS 三個版本
  • 目前 zsh.sh 中包含 oh-my-zsh,fzf,vimrc 三塊的配置

在使用過程中，肯定會有一些小困難，歡迎在 issue 或者評論區跟我交流。??

個人感覺使用起來，還是蠻爽的。科技解放生產力~

Vscode

VSCode 真香

VSCode 真香 VSCode 真香

hhh 之前我一直是 Sublime 佈道者，VSCode 黑

直到最近，主力 IDE 已經變成 VSCode 了

特別是最近 VSCode 正式發布vscode-remote

第一眼 看到的時候 震驚了！！！

這意味著以後你可以在伺服器上用 VSCode 寫代碼，這還要什麼coder-server

先鞭屍一下 coder-server, 相較於 vscode-remote:

  • coder-server, 橫向擴展性差，必須在相應的伺服器上部署 coder-server
  • 配置麻煩，我們本地 local 的 VSCode 肯定會花大力氣配置，但如果有 n 臺伺服器呢，你還會這麼做嗎（寫個腳本，不好意思，這個有點難寫）
  • 所以一開始看到 code-server 的時候沒有那麼驚喜，（流露出配過環境的人的眼淚 ??

但實際上coder-server還是有很多優點的，大家不要被我帶偏

部署在服務端，只需瀏覽器可達ide還是很酷炫的。(雖然目前還是偽命題，你還是去load js 在本地chrome編譯運行，我們可以看到首包js在2.4M，遠小於local vscode)

然後目前coder-server對ARM等嵌入式小型OS支持的比較好，remote

然後因為二者都依賴node，目前node已經放棄支持32bit版本，對於32bit OS 來說來沒有一個好的解決方案。

試驗下來超級順滑，除了現在 vscode-remote 只支持 64bit 的 Linux 這一點，其他都很絲滑（Nachos 還是不能用 hhh

除了支持 ssh 連接之外，還支持 Docker Container 的連接，超級棒了

但 vscode-remote 目前出於公測階段，只能在綠色的 VSCode Insider 中使用，而且功能還待完善

給我個理由

那麼作為一個忠實的 Sublime 用戶，為何會從 Sublime 遷移到 VSCode 來

當時覺得 Sublime 有幾點特別吸引我:

  1. 好看
  2. 輕量
  3. 可配置實現 ide 喚起編譯運行
  4. 保存時自動調整代碼格式
  5. 寫 cpp 的時候模板用起來特別爽
  6. 可以設置帶有 File Header

而這些 我都在 VSCode 中一個個實現了

因為 之前配置的 Vscode 裝插件裝的特別多 在代碼量特別大的時候（7k-8k 行），code help 進程就會打滿，整個機子就會石樂志一樣

再加上 vscode-remote 只支持 Insider 版，就順道把配置理了一下

Save Format

這裡用到的是Formatting Toggle + Prettier這個插件，支持的文件類型還是比較多的，比如給 markdown 表格自動格式化，這還是挺酷炫的

{
"formattingToggle.activateFor": ["formatOnSave"],
"editor.formatOnSave": true,
"files.autoSave": "onFocusChange"
}

File Header

這個用了psioniq File Header, 文檔還是比較詳細的，但配置十分繁瑣，弄了好長時間，還給作者發郵件，hhh

{
"psi-header.changes-tracking": {
"autoHeader": "autoSave",
"isActive": true,
"modDate": "@Last Modified time: ",
"modAuthor": "@Last Modified by: ",
"include": [],
"exclude": ["markdown", "json"],
"excludeGlob": ["out/**", "src/**/*.xyz"]
},
"psi-header.config": {
"forceToTop": true,
"blankLinesAfter": 1,
"author": "gunjianpan",
"authorEmail": "[email protected]",
"license": "Custom"
},

"psi-header.lang-config": [
{
"language": "python",
"begin": "",
"prefix": "# ",
"end": "",
"beforeHeader": ["# -*- coding: utf-8 -*-"]
},
{
"language": "shellscript",
"begin": "",
"prefix": "# ",
"end": "",
"beforeHeader": ["#!/bin/bash"]
},
{
"language": "javascript",
"begin": "/**",
"prefix": " * ",
"end": " */",
"blankLinesAfter": 2,
"forceToTop": false
},
{
"language": "typescript",
"mapTo": "javascript"
}
],
"psi-header.templates": [
{
"language": "*",
"template": [
"@Author: <<author>>",
"@Date: <<filecreated(YYYY-MM-DD HH:mm:ss)>>",
"@Last Modified by: <<author>>",
"@Last Modified time: <<dateformat(YYYY-MM-DD HH:mm:ss)>>"
]
}
]
}

代碼編譯運行

雖然提供了在 Output 中輸出運行結果的插件Code Runner

但很多場景是需要互動式的，(比如說刷 leetcode ????

這個時候 就需要配置一下

{
"code-runner.executorMap": {
"javascript": "node",
"perl": "perl",
"go": "go run",
"python": "ipython3",
"java": "cd $dir && javac $fileName && /Library/Java/JavaVirtualMachines/jdk1.8.0_181.jdk/Contents/Home/bin/java -javaagent:/Applications/IntelliJ IDEA.app/Contents/lib/idea_rt.jar=60957:/Applications/IntelliJ IDEA.app/Contents/bin -Dfile.encoding=UTF-8 -classpath $dir $fileNameWithoutExt",
"c": "cd $dir && /usr/bin/gcc $fileName -o $fileNameWithoutExt && open -a Terminal.app $dir$fileNameWithoutExt",
"cpp": "cd $dir && /usr/bin/g++ -std=c++11 $fileName -o $fileNameWithoutExt && $dir$fileNameWithoutExt"
}
}

能像 Intellij IDEA 一樣能查 local History

Local History

{
"local-history.daysLimit": 30,
"local-history.maxDisplay": 16,
"local-history.saveDelay": 0,
"local-history.dateLocale": "en-GB",
"local-history.exclude": [
"**/.history/**",
"**/.vscode**",
"**/node_modules/**",
"**/typings/**",
"**/out/**",
"**/__pycache__/**",
"**/.ipynb_checkpoints/**",
"**/data/**",
"**/.DS_Store/**",
"**/checkpoint/**"
]
}

Live Share

然後比較推薦的時候 Vscode 的 Live Share, 這是我隊友給我推薦的

你可以用 Live share 多人寫代碼，也可以用來作為遠程 Terminal 幫忙調試的媒介

一鍵召喚神龍

Latex

Vscode 畢竟是宇宙第一操作系統， 在上面敲 Latex 也是很爽的，配上 Latex 公式神器Mathpix snipping Tool

Other

  • Monokai Pro, Theme
  • sort lines, import sort
  • polacode, 代碼圖片生成上一篇講了很多 Mac 中配置的小技巧如何給碼農 ?????? 的 Mac 開光

推薦閱讀：

相關文章