# 安裝 Windows 的 WSL

###### tags: `給外行人的前端入門指南`, `前端筆記`

> Windows/WSL 前端開發環境設定

本文寫作預設閱讀對象：
- 只用過 Windows 系統，沒寫過任何程式的人
- 可能想入門的程式語言是 Python 或 JavaScript[^不一定要用Linux入門]
- 還不確定學程式是為了做什麼，但不排斥學學看前端相關的東西[^寫給想開發遊戲的人的備註]

[^不一定要用Linux入門]: 如果只是想學習這個兩個程式語言，入門學語法其實現在用 Windows 也是可以的。甚至有些坊間的課程也是在 Windows 的環境下教學。我會推薦用 WSL 只是因為 MacOS 與 Linux 的一些使用的概念比較接近，一些套件的生態比較完整，而且網路相關的產業應該幾乎都會碰到；至少前端框架的部分，可能用 WSL 去處理可能還是比 PowerShell 或 cmd 順一點。

[^寫給想開發遊戲的人的備註]: 每個方向使用的工具不同，例如在台灣想做遊戲開發相關的工作，你可能需要的是 Unity 遊戲引擎的開發經驗， Unity 使用的是 C# 語言，建議可以找到相關的遊戲開發者社群去詢問學習的方向。如同網頁開發，遊戲產業的一些開發工具也十分快速，建議找相關的社群或開發者尋文，可能比較能獲得適合的資訊。

## 前言

對於學習「寫程式」這件事情，有些人會建議找一台電腦裝 Linux ，有些人會建議買一台 Mac （或者說 Macbook ），有些人會覺得在 Windows 上也是可以學習寫程式。其實這三種說法都沒錯，只是依照你想做的事情、目標的不同，可能有相對比較適合的工具組合。

我目前[^備註這篇文章開始寫作的時間]學習、做作品集的目的是想找到一份前端工程師的入門工作（如果你不知道這是什麼，暫時先理解成寫網頁介面），想要建立基本的開發環境。沒什麼偉大的原因，因為我原本有一台用了五六年的 Macbook ，去年請它喝了飲料掛了，我得找新的機器做作品集，但目前沒預算買新的 Mac 。（其他閒聊故事請見文末的 Fluff 小節，想法雜記集中在那邊。）

昨天吃飯的時候，一個做前端工程師的朋友建議我可以寫 blog ，寫教學、學習記錄等等。我不太確定我這種連菜鳥都還不是的人寫的東西能對別人有什麼幫助，但用過 Mac 、 Ubuntu （裝雙系統）之後，想想也許 **WSL （ Windows Subsystem for Linux ）**，對於想自學的入門者來說，也許是個蠻不錯的工具……比起重新安裝系統聽起來不那麼嚇人，比起再買一台 Mac 來說，可能也便宜許多。

總之，是要建立一個工作環境，讓自己練習寫網頁前端用的程式的時候不需要煩惱太多系統本身設計的坑[^筆者對開發環境的猜想]。

以下進入正題。

[^備註這篇文章開始寫作的時間]: 本文初寫於 2023 年 03 月 24 日
[^筆者對開發環境的猜想]: 我個人覺得……如果真的有機會做前端的正職工作的話……也許終究還是會用到 Mac ？這個等我找到正職再來確認。

## 系統環境確認

作業系統： Windows 10[^備註Win10的原因] 或 Windows 11

- Windows 10
- x64 systems: 版本 1903 以上, 組建 18362 以上。
- ARM64 systems: 版本 2004 以上, 組建 19041 以上。
- 或 Windows 11

文件中沒有詳載其他硬體規格，但我想至少硬碟的部分可能留給這個子系統要用的部分至少 10 到 20 GB 或以上（通常一開始用不太到更多就是了）。其他效能的部分目前查不太到資料，先略。

[^備註Win10的原因]: 因為現在可能是在 Win10 與 Win11 的交接年代，所以還是備註一下

[^系統需求]: 系統需求，參考 WSL 文件 https://learn.microsoft.com/en-us/windows/wsl/install-manual#step-2---check-requirements-for-running-wsl-2

## 用 WSL 安裝 Linux

### 使用 PowerShell 安裝

打開 PowerShell ，輸入以下指令，就可以用 WSL 安裝 Linux （預設是 Ubuntu ）。

wsl --install


這個指令如過遇到以下之類的問題，說有些必要的 feature 沒有安裝，找 Windows Feature （待確認中文）打開，勾選啟用 Virtual Machine Platform 與 Windows Subsystem for Linux （[參考資料](https://superuser.com/questions/1736443/wsl-2-installing-linux-failed-error-code-0x80370114)）。

WSL 2 Installing Linux failed, error code: 0x80370114

**【注意】** 這個安裝過程可能依照你的網路速度的狀況不同會需要不同的時間，建議一次做完（例如設定使用者帳號與密碼）中途不要去做其他的事情，如果因為什麼原因中斷導致安裝失敗，清理與重新安裝有點麻煩（待另外寫教學筆記）。

設定完 Unix 的使用者帳號密碼後，會啟動 Ubuntu ，你看到你的使用者名稱開頭，結尾是『 $ 』字號的提示符號，那就是成功了（圖中我模糊掉的部分是電腦名稱……只是覺得應該隱藏一下）。


### 離開 PowerShell 下的 Ubuntu

輸入指令

exit

輸入後，按下 enter ，即可離開 Ubuntu ，你可以看到提示符號變回

PS C:\Users\User>

這裡的 User 會跟你 Windows 設定的使用者名稱一樣。然後就可以關閉 PowerShell （可以用 exit 指令，類似的用法）


### 把 Ubuntu 的捷徑放到方便取用的地方


### 直接開啟 Ubuntu 子系統


你可以看到這裡提示你說「要以系統管理員 root 的身分執行指令，請用 "sudo <指令>" 。」這類提示不一定每次都會出現，例如目前這個可能用過 sudo 執行指令後就不會再提示。

### 更新套件

更新系統上的套件資訊

sudo apt update

更新套件

sudo apt upgrade

以上兩個指令想一次同時執行的話，可以像以下這樣寫：

sudo apt update && sudo apt upgrade -y

## 安裝 VSCode

幾種安裝方式

- [Visual Studio Code 官網](https://code.visualstudio.com/) 下載安裝檔
- PowerShell 下用 winget 指令

用 winget 搜尋 VSCode

winget search vscode


用 winget 安裝 VSCode

winget install --id Microsoft.VisualStudioCode --source winget

## 參考資料

- [WSL 文件](https://learn.microsoft.com/zh-tw/windows/wsl/)
- [PowerShell 文件](https://learn.microsoft.com/zh-tw/powershell/)

## 註腳