🚀 在 VS Code 中取得 ！

在 Chromebook 上使用 VS Code 學習

2020 年 12 月 3 日，作者：Alessandro Segala，@ItalyPaleAle

在過去幾年中，執行 Google Chrome OS 的 Chromebook 已成為「傳統」筆記型電腦的替代方案。由於從非常經濟實惠的型號到高階型號都有許多選擇，Chromebook 在學生中尤其受歡迎，他們可以使用 Chromebook 進行學習、完成作業和參加線上課程。

雖然 Chromebook 和 Chrome OS 通常以網頁瀏覽器為中心，但您也可以啟用 Linux 環境，以安裝原生桌面應用程式，包括 Visual Studio Code！

在 Chromebook 上執行 VS Code 後，您可以輕鬆快速地開始以各種語言和架構進行程式碼撰寫。這包括 Python、JavaScript 和 Node.js、Java 和 C# 等多種語言！

在本文（共兩篇中的第一篇）中，我們將探討如何在 Chromebook 上安裝 Visual Studio Code，以及如何設定環境以開始使用 Python 或 JavaScript/Node.js 進行程式碼撰寫。在之後的文章中，我們也將探討如何運用 遠端開發 VS Code 擴充功能，以連線至更強大的開發環境。

您需要的東西

VS Code 可在任何最新的 Chromebook 上執行，只要您能夠透過 Crostini 啟用 Linux 應用程式，我們稍後將說明如何操作。

Visual Studio Code 是一個輕量型編輯器，因此您可以在低功耗的 Chromebook 上執行它，最低需求為 1 GB RAM。此外，VS Code 現在也適用於 ARMv7 和 ARM64 上的 Linux，這表示您也可以在搭載 ARM 晶片的 Chromebook 上執行它！

在本教學課程中，我將使用入門級 Chromebook，配備 ARM64 CPU、4 GB RAM 和 32 GB 磁碟。儘管規格不高，但 VS Code 在這部機器上執行良好！

在 Chromebook 上啟用 Linux

在我們可以在 Chrome OS 上安裝 VS Code 之前，我們需要使用 Crostini 啟用對原生 Linux 應用程式的支援。

首先，開啟您的系統「設定」，然後在側邊欄上尋找 Linux (Beta)。從那裡開啟 Linux 支援。

Enabling Linux support on Chrome OS

依照螢幕上的指示設定 Linux 環境 (對於大多數人來說，接受預設值就已足夠)。然後，您的 Chromebook 將下載工具以建立 Linux 環境並為您設定。在幕後，這實際上是建立一個執行 Debian 10 的容器，因此您可以獲得完整的 Linux 發行版來使用！

設定好 Linux 環境後，您會看到一個新的終端機視窗彈出。

Terminal running on Linux

在我們可以安裝 VS Code 之前，我們需要在 Linux 終端機中執行幾個命令。我們需要更新 Linux 套件清單，並安裝選用 (但強烈建議) 的相依性 gnome-keyring。在終端機中，輸入以下兩個命令 (在每個命令結尾按下 Enter 鍵以執行它們)

sudo apt-get update
sudo apt-get install -y gnome-keyring

輸出會與此類似

Output of the commands in the terminal

第二個命令結束後，您就可以移至下一個步驟。

安裝 VS Code

我們現在已準備好安裝 VS Code！

前往 Visual Studio Code 下載 頁面。從那裡，您需要為您的 Chromebook 挑選正確的套件

  • 對於執行 Intel 或 AMD 晶片的 Chromebook，請挑選 .deb 中的 64 位元 變體。
  • 如果您的 Chromebook 在 ARM64 晶片上執行 (例如我正在測試的那個)，請改為挑選 ARM64 變體的 .deb 套件。

List of downloads

如果您不確定您的 Chromebook 使用哪種 CPU，請在 Linux 終端機中執行命令 dpkg --print-architecture 以找出。您會看到 amd64 (適用於 Intel 和 AMD 晶片：為 VS Code 挑選 64 位元 變體) 或 arm64 (挑選 ARM64)。

Output of the command to find the architecture: this laptop is running on arm64

在您下載 VS Code 之後，您會在您的 下載 資料夾中找到套件。按兩下套件以啟動安裝程式

Package installer asking to install VS Code

然後，您的 Chromebook 將安裝 VS Code 和所有其他相依性。

安裝完成後，在您的應用程式清單中，您會在名為 Linux 應用程式 的資料夾內找到 Visual Studio Code (以及 Linux 終端機)。您現在可以啟動 VS Code。

Launching the Visual Studio Code app

您應該會看到 VS Code 正在執行，此時您已準備好開始程式碼撰寫！

VS Code running on the Chromebook

如果您是 VS Code 的新手，並且想知道如何使用編輯器，以下是一些資源供您探索

  • VS Code 簡介影片：這些影片將說明如何使用 VS Code 開啟檔案和資料夾、安裝佈景主題和擴充功能、設定編輯器等等。
  • 使用 VS Code 學習程式碼撰寫：我們的「學習」區段包含針對程式碼撰寫新手且想要開始入門的人員的文章、教學課程和影片。

使用 JavaScript 和 Node.js 進行程式碼撰寫

JavaScript 是一種非常彈性的程式設計語言，可用於建置在網頁瀏覽器內和網頁伺服器上使用 Node.js 執行的應用程式。如今，JavaScript 也被用於建置原生桌面應用程式 (Electron) 和行動應用程式 (Apache Cordoba、React Native 等)、程式設計物聯網 (IoT) 裝置等等。

提示：如果您想學習 JavaScript，我們的同事製作了一個免費影片系列：觀看：JavaScript 初學者系列

Visual Studio Code 是使用 JavaScript 和 Node.js 進行程式碼撰寫的非常熱門的編輯器 (State of JS 調查)，並且原生支援 JavaScript。

但是，為了在您的 Chromebook 上使用 Node.js (和一般 JavaScript)，您必須安裝 Node.js 執行階段。為此，我們將使用 nvm，這是一個小型的開放原始碼公用程式，可讓您更輕鬆地安裝 Node.js 並更新它。

若要安裝 nvm，請在 Linux 終端機內執行以下命令

wget -qO- https://raw.githubusercontent.com/nvm-sh/nvm/v0.37.2/install.sh | bash
source .bashrc

Installing nvm

在您安裝 nvm 後，您可以使用此命令安裝最新版本的 Node.js

nvm install node

Installing Node.js via nvm

提示：您是否知道 VS Code 包含整合式終端機？您可以從 終端機 功能表啟動它，然後選擇 新增終端機。VS Code 在 Linux 環境的內容中執行，因此整合式終端機也在 Linux 中執行。

nvm 提供許多選項來設定、更新和管理 Node.js。如果您有興趣，可以在 nvm 的官方文件中閱讀更多資訊。

在安裝 Node.js 之後，您可以在終端機中使用 node 命令 (執行 node --version 是檢查您的 Node.js 安裝的好方法)，以及 VS Code 的所有內建功能，例如 Node.js 和 JavaScript 的整合式工作執行器和偵錯工具。若要深入瞭解如何在 VS Code 中使用 JavaScript 和 Node.js，請查看 VS Code 文件！

使用 Python 進行程式碼撰寫

Python 是另一種熱門的程式設計語言，它特別適合初學者。使用 Python，您可以為網頁、桌面和命令列建置應用程式。Python 是最適合用於資料科學和人工智慧 (AI) 的語言之一，它也用於程式設計 IoT 裝置、微控制器等等！

VS Code 是用於程式碼撰寫 Python 和學習該語言的絕佳編輯器。您可以在 VS Code 中使用 Python 來建置各種應用程式，以及使用 Notebooks，例如資料科學家使用的那些。

提示：如果您正在尋找 Python 入門指南，這裡也有一個免費影片系列供您參考：觀看：Python 簡介影片系列

Chrome OS 已預先安裝 Python 3 直譯器，但我們需要安裝更多套件才能獲得最佳的 Python 程式碼撰寫體驗。這包括 pip (Python 的相依性管理員)、venv (用於管理 Python 虛擬環境) 以及一些用於處理原生套件的建置工具。在終端機中，執行

sudo apt-get install -y python3-pip python3-dev python3-venv build-essential libssl-dev libffi-dev

Installing Python dependencies

VS Code 中的 Python 支援是透過 Microsoft Python 擴充功能提供的。若要安裝 Python 擴充功能，請從 VS Code 內使用左側的活動列開啟「擴充功能」檢視 (⇧⌘X (Windows、Linux Ctrl+Shift+X))，然後搜尋「python」並安裝 Microsoft 提供的擴充功能

Installing the Python extension for VS Code

此時，您已準備好開始使用 VS Code 開發 Python！若要深入瞭解如何在 VS Code 中使用 Python，包括執行您的程式碼、使用整合式偵錯工具、程式碼檢查等等，請查看我們的 VS Code 中的 Python 文件。

接下來：使用遠端開發

今天就到這裡！在這篇文章中，我們探討了如何在 Chromebook 上安裝 VS Code，以及如何開始使用 JavaScript/Node.js 和 Python 進行程式碼撰寫。

但是等等，還有更多。雖然 Chromebook 可以正常執行 VS Code，即使在像我正在測試的這種低功耗版本上也是如此，但有時您需要使用更快的機器進行開發，並具有更多記憶體和/或更快的 CPU。例如，也許您正在使用 ARM 驅動的 Chromebook，但您需要在 Intel/AMD 晶片上執行您的程式碼。或者，也許您想要使用人工智慧，並且需要存取具有強大 GPU 的機器。

透過 VS Code 和 遠端開發 擴充功能 (SSH 和 Container)，以及 GitHub Codespaces，我們可以解決上述所有問題以及更多問題。

在本教學課程的下一部分中，您將學習 VS Code 遠端擴充功能和 GitHub Codespaces 如何將您的 Chromebook 變成開發強大的工具！

同時，祝您程式碼撰寫愉快…學習愉快！

Alessandro Segala，VS Code 產品經理 @ItalyPaleAle