Dart 開發環境設定與 SDK 工具介紹

– 16 分鐘閱讀

在臺灣的軟體開發圈，Dart 正逐漸受到重視，尤其在跨平臺應用開發方面。要踏入 Dart 的世界，首先需要設定好開發環境。這包含安裝 Dart SDK，選擇合適的開發工具，以及熟悉 Dart 的專案架構。Dart SDK 提供了許多命令列工具，例如 dart compile、dart run 等，方便開發者編譯、執行和管理 Dart 程式。此外，選擇一個支援 Dart 的 IDE，像是 VS Code，並安裝 Dart 擴充套件，可以大幅提升開發效率。瞭解 Dart 專案的結構，包含 bin、lib、pubspec.yaml 等目錄和檔案，對於管理程式碼和依賴庫至關重要。

Dart 環境設定與開發工具

為了開始 Dart 的開發旅程，我們需要設定適當的開發環境。這包括安裝 Dart SDK 和選擇一個合適的編輯器或 IDE。

Dart SDK 安裝

Dart SDK 是一套命令列工具的集合，讓開發者可以建立 Dart 應用程式。要安裝 Dart SDK，請前往 Dart 官方網站下載並安裝適合您平臺的版本。如果安裝過程中遇到錯誤，請嘗試複製錯誤訊息並在 Google 中搜索解決方案。

Dart SDK 安裝驗證

安裝完成後，開啟終端機並執行以下命令以驗證 Dart SDK 是否已正確安裝：

dart --version

這應該會顯示目前的 Dart 版本。如果您的版本低於 2.18，建議升級到最新版本，以確保書中的範例能夠正常運作。

選擇編輯器或 IDE

有多種編輯器和 IDE 支援 Dart 開發，包括：

  • IntelliJ IDEA：一款功能強大的整合開發環境，透過 Dart 外掛程式支援 Dart 開發。
  • Visual Studio Code (VS Code)：一款輕量級、開源的 IDE，具有簡潔的介面，透過 Dart 擴充功能支援 Dart 開發。
  • 其他編輯器：還有來自社群的 Dart 外掛程式適用於 Eclipse、Emacs 和 Vim 等編輯器。

本文使用 VS Code 作為所有範例的編輯器，但如果您偏好其他 IDE 或編輯器，也可以繼續使用。VS Code 同時也支援 Flutter 開發，因此選擇 VS Code 不會限制未來的 Flutter 開發。

安裝 Visual Studio Code

VS Code 是一款跨平臺、開源的 IDE，適用於 Windows、MacOS 和 Linux。您可以從官網下載並安裝。

安裝 Dart 擴充功能

安裝 VS Code 後，需要安裝 Dart 擴充功能以支援 Dart 開發。這可以在 VS Code 的擴充功能商店中完成。

開始您的 Dart 旅程

現在您已經設定好了開發環境，接下來可以開始您的 Dart 學習旅程。每一章都會在前一章的基礎上進行，建議您按照章節順序進行學習，以獲得最好的效果。

上述過程中，我們安裝了 Dart SDK 和選擇了一款編輯器（VS Code），並安裝了 Dart 擴充功能。這些步驟為我們的 Dart 學習旅程奠定了基礎。接下來，我們將深入探討 Dart 的基礎知識和開發技巧。

  flowchart TD
    A[開始] --> B[安裝 Dart SDK]
    B --> C[驗證 Dart SDK 安裝]
    C --> D[選擇編輯器或 IDE]
    D --> E[安裝 Visual Studio Code]
    E --> F[安裝 Dart 擴充功能]
    F --> G[開始 Dart 學習旅程]

這個流程圖描述了我們為了開始 Dart 學習旅程所進行的步驟，從安裝 Dart SDK 到選擇和設定適當的編輯器或 IDE。

Dart SDK 的內容

讓我們來看看 Dart SDK 提供了哪些工具，以下是由玄貓整理的內容：

當您輸入 dart help 時，您會看到一份 Dart SDK 中的工具列表。雖然您可能不會直接與其中大部分工具互動，但瞭解它們的功能仍然很有幫助：

  • analyze：您的 IDE 使用此工具來告訴您何時在您的程式碼中犯了錯誤。您越早知道錯誤，越早可以修復它！
  • compile：此工具將 Dart 程式碼編譯成 Windows、Linux 或 macOS 的最佳化原生可執行程式。這被稱為提前編譯（AOT）。除了原生可執行檔案外，Dart 還關注 Web 技術，因此您也可以使用 compile 工具將 Dart 程式碼轉換為 JavaScript。
  • create：此工具用於建立新的 Dart 專案，您將在下一分鐘內自己建立一個。
  • devtools：這是一組工具，幫助您完成除錯或配置 CPU 和記憶體使用量等任務。
  • doc：如果您的程式碼包含文件注釋，您將在下一章學習到這一點，此工具將生成顯示注釋為 Web 頁面的 HTML。
  • fix：Dart 的目標之一是繼續演進而不會因為過時或不推薦的程式碼而變得臃腫。fix 工具在此方面提供了幫助，讓開發人員可以更新舊專案以使用最新的 Dart 語法。
  • format：此工具可以自動糾正程式碼中的縮排。
  • migrate：Dart 2.12 是 Dart 語言的一個重大更新，增加了 null 安全性，您將在第 11 章「Nullability」中學習到這一點。這個工具幫助舊專案遷移到使用 null 安全性。由於您是從頭開始的，因此您不需要遷移任何內容。
  • pub：Pub 是 Dart 的套件管理器，而 pub 工具則負責處理這項工作。套件是您可以在 Dart 專案中使用的第三方程式碼集合。這可以節省您大量的時間，因為您不需要自己編寫這些程式碼。
  • run：此工具在 Dart 虛擬機器（VM）中執行您的 Dart 程式。您將使用 Dart VM 在程式碼需要時編譯它。與 AOT 相比，這被稱為即時編譯（JIT），允許您對程式碼進行小的修改並幾乎瞬間重新執行。
  • test：Dart 完全支援單元測試，而此工具將幫助您完成測試。

Dart 的命令列介面

現在您已經安裝了 Dart SDK，您將使用 Dart VM 執行幾行程式碼，首先是在單個檔案中，然後作為完整的專案。

執行單個 Dart 檔案

在您的電腦上找到或建立一個方便的資料夾，用於儲存您在本文中建立的 Dart 專案。然後，在該資料夾中建立一個名為 hello.dart 的新文字檔案。

編寫程式碼

接下來，將以下 Dart 程式碼新增到該空檔案中：

void main() {
  print('Hello, Dart!');
}

main 是所有 Dart 程式開始的函式名稱。在此函式內，您呼叫另一個函式 print，它在螢幕上顯示文字 “Hello, Dart!"。

執行程式碼

儲存檔案，然後在與 hello.dart 相同的資料夾中執行以下終端命令：

dart run hello.dart

run 標籤是您之前學習的 Dart SDK 中的 run 工具。它在 Dart VM 中執行 hello.dart 中的程式碼。

您現在應該在控制檯中看到以下輸出：

Hello, Dart!

恭喜您！您已經編寫並運行了您的第一個 Dart 程式。

設定完整的 Dart 專案

雖然可以執行單個檔案，但當您構建更大的專案時，您將想要將程式碼分成可管理的部分，並包含配置和資原始檔。為此，您需要建立一個完整的 Dart 專案。請記住 create 工具。

建立專案

前往您要建立專案資料夾的位置，然後在終端中執行以下命令：

dart create hello_dart

這會建立一個簡單的 Dart 專案，包含一些預設程式碼。

執行專案

進入您剛剛建立的新資料夾：

cd hello_dart

現在，執行專案：

dart run bin/hello_dart.dart

您將看到文字 “Hello world: 42!"，它是預設專案程式碼的輸出。

run 標籤是可選的。再次執行專案，但這次不使用 run：

dart bin/hello_dart.dart

Dart 專案結構與開發環境

Dart 是一種強大的程式語言，廣泛應用於移動應用、網頁應用和伺服器應用。要開始使用 Dart，瞭解其專案結構和開發環境是非常重要的。

Dart 專案結構

一個典型的 Dart 專案包含以下幾個重要的目錄和檔案：

  • .gitignore：指定 Git 要忽略的檔案和目錄。
  • analysis_options.yaml：定義 Dart 程式碼分析的規則和選項。
  • bin：存放可執行的 Dart 程式碼。
  • lib：存放 Dart 函式庫的目錄。
  • pubspec.yaml：指定專案的依賴和版本號。
  • pubspec.lock：記錄專案依賴的精確版本。
  • README.md：專案的簡介和使用說明。
  • test：存放測試檔案的目錄。

使用 VS Code 進行 Dart 開發

VS Code 是一種流行的開發環境，提供了豐富的擴充功能和工具。要使用 VS Code 進行 Dart 開發，需要安裝 Dart 擴充功能。

安裝 Dart 擴充功能

  1. 開啟 VS Code。
  2. 點選左側的擴充功能圖示。
  3. 搜尋 “Dart” 並安裝 Dart 擴充功能。

建立新的 Dart 專案

  1. 開啟命令面板（Command Palette）。
  2. 輸入 “Dart: New Project” 並選擇。
  3. 選擇 “Console Application” 作為專案型別。
  4. 指定專案名稱和存放位置。

瀏覽生成的程式碼

  1. 開啟 bin 目錄下的 hello_dart.dart 檔案。
  2. 檢視生成的程式碼，瞭解其結構和功能。

簡化專案

  1. 將 hello_dart.dart 檔案中的程式碼替換為簡化版本。
  2. 刪除不必要的目錄和檔案。

執行 Dart 程式碼

  1. 開啟 hello_dart.dart 檔案。
  2. 點選 “Run” 按鈕執行程式碼。
  3. 檢視輸出的結果。

探索 VS Code 使用者介面

現在是探索 Visual Studio Code 各個部分的好時機。下面的數字對應於 IDE 的不同部分： 活動欄：選擇要在側邊欄顯示的內容。 1 側邊欄：檔案總管目前顯示的是當前的專案和檔案。 2 編輯器：在這裡撰寫您的 Dart 程式碼。 3 面板：顯示程式輸出、執行終端命令等。 4 狀態列：顯示有關當前專案的資訊。 5

按 F5 鍵。 2 點選右上角的「開始偵錯」按鈕。 3 所有這些做法都是一樣的。這次使用 F5 鍵來執行程式，您將再次在偵錯主控臺中看到「Hello, Dart!」。

關鍵點

Visual Studio Code 是一個整合開發環境（IDE），您可以在安裝 Dart 擴充功能後使用它來撰寫 Dart 程式碼。 Dart SDK 提供了編譯和執行 Dart 應用程式所需的底層工具。 在命令列或 VS Code 中執行的 Dart 程式碼都使用 Dart 虛擬機器。 VS Code 視窗分為活動欄、側邊欄、編輯器、面板和狀態列。 Pub 是 Dart 使用的套件管理器，用於向您的專案新增第三方原始程式碼。

程式碼解說

// 這是一個單行註解

這是一個單行註解的例子。

/* 這是一個多行註解
   可以跨越多行 */

這是一個多行註解的例子。

/// 這是一個檔案註解
/// 可以用於生成檔案

這是一個檔案註解的例子。

圖表翻譯

  flowchart TD
    A[開始] --> B[撰寫 Dart 程式碼]
    B --> C[執行程式]
    C --> D[顯示輸出]

這個流程圖展示了撰寫和執行 Dart 程式碼的過程。

在未來的章節中，您將學習到更多關於 Dart 的知識，包括如何撰寫複雜的程式碼、如何使用第三方套件等。同時，您也將學習到如何使用 VS Code 來提高您的開發效率。

Dart 基礎：表示式、變數和常數

Dart是一種強大的程式語言，能夠讓開發者快速地建立高品質的應用程式。在這篇文章中，我們將探討Dart的基礎知識，包括表示式、變數和常數。

表示式和語句

在Dart中，表示式和語句是兩個重要的概念。語句是一個命令，告訴電腦要做什麼。在Dart中，所有簡單的語句都以分號結尾。例如，print語句：

print('Hello, Dart!');

分號在語句的結尾，用於標誌語句的完成。

另一方面，表示式是一個值，或是一個可以計算出值的東西。例如：

42
3 + 2
'Hello, Dart!'
x

這些表示式可以是數字、文字或其他型別的值。它們甚至可以是變數，例如x，其值在執行時才會被確定。

算術運算

Dart提供了各種算術運算子，包括加法、減法、乘法和除法。這些運算子使用符號來表示運算的型別。例如：

3 + 2  // 加法
3 - 2  // 減法
3 * 2  // 乘法
3 / 2  // 除法

這些運算子可以用於簡單的數字運算。

變數和常數

在Dart中，變數和常數是用於儲存值的。變數可以在程式執行過程中被修改，而常數則不能被修改。例如：

var x = 5;  // 變數
const y = 10;  // 常數

變數x可以被修改，而常數y則不能被修改。

在這篇文章中，我們使用了Dart的語法和結構來解釋基礎的概念。例如，使用print語句來輸出值，使用算術運算子來進行簡單的運算。這些語法和結構是Dart程式設計的基礎，理解它們對於建立高品質的應用程式是非常重要的。

  graph LR
    A[表示式] --> B[語句]
    B --> C[算術運算]
    C --> D[變數和常數]
    D --> E[控制流]
    E --> F[函式]
    F --> G[物件導向程式設計]

這個圖表展示了Dart程式設計的基礎知識的關係，從表示式和語句開始，然後是算術運算、變數和常數，最後是控制流、函式和物件導向程式設計。這個圖表可以幫助開發者瞭解Dart程式設計的基礎知識和它們之間的關係。

基礎運算子

在 Dart 中，基本的運算子包括加法、減法、乘法和除法，分別用 +、-、* 和 / 來表示。這些運算子的使用方式與我們在紙上寫算式的方式相似。例如：

print(2 + 6);  // 結果為 8
print(10 - 2);  // 結果為 8
print(2 * 4);  // 結果為 8
print(24 / 3);  // 結果為 8.0

注意，當你使用 / 進行除法運算時，結果可能是一個小數，即使結果是整數。這是因為 Dart 的 / 運算子會傳回一個小數結果。

數值型別

Dart 支援多種數值型別，包括整數和小數。整數是沒有小數部分的數值，例如 1、2 等。小數則是具有小數部分的數值，例如 3.14。

小數運算

當你進行小數運算時，Dart 會傳回一個小數結果。例如：

print(22 / 7);  // 結果為 3.142857142857143

如果你想要進行整數除法，則可以使用 ~/ 運算子：

print(22 ~/ 7);  // 結果為 3

餘數運算

Dart 也支援餘數運算，使用 % 運算子。餘數運算會傳回除法運算的餘數。例如：

print(10 % 3);  // 結果為 1

這是因為 3 可以整除 10 三次，餘數為 1。

格式化程式碼

Dart 提供了一個 dart format 工具，可以幫助你格式化程式碼。這個工具可以自動新增空白字元和縮排，以使你的程式碼更容易閱讀。你可以在 VS Code 中使用 Shift+Option+F（Mac）或 Shift+Alt+F（PC）快捷鍵來啟用這個工具。

練習

你可以使用 print 陳述式來檢查 Dart 運算式的結果。例如：

print(2 + 6);  // 結果為 8
print(10 - 2);  // 結果為 8
print(2 * 4);  // 結果為 8
print(24 / 3);  // 結果為 8.0

你也可以使用 ~/ 運算子進行整數除法：

print(22 ~/ 7);  // 結果為 3

並使用 % 運算子進行餘數運算：

print(10 % 3);  // 結果為 1

數學運算與函式

在 Dart 中，數學運算可以使用各種運算子進行。例如，模運算可以使用 % 運算子實作。以下是一個例子：

void main() {
  int result = 28 % 10;
  print(result); // 輸出：8
}

在這個例子中，28 % 10 的結果是 8，因為 10 去除 28 後餘數為 8。

運算順序

當您使用多個運算子進行計算時，Dart 會按照運算順序規則執行運算。以下是一個例子：

void main() {
  double result = (8000 / (5 * 10)) - 32;
  result = result ~/ (29 % 5);
  print(result);
}

在這個例子中，Dart 會先計算 5 * 10，然後計算 8000 / (5 * 10)，最後計算 (8000 / (5 * 10)) - 32。

如果您想要改變運算順序，可以使用括號。例如：

void main() {
  double result = 350 / (5 + 2);
  print(result);
}

在這個例子中，Dart 會先計算 5 + 2，然後計算 350 / (5 + 2)。

運算子優先順序

Dart 的運算子優先順序規則如下：

  • 乘法和除法優先順序最高
  • 加法和減法優先順序次之

以下是一個例子：

void main() {
  double result = 350 / 5 + 2;
  print(result); // 輸出：72.0
}

在這個例子中，Dart 會先計算 350 / 5，然後計算 72.0 + 2。

數學函式

Dart 提供了許多數學函式，包括三角函式、平方根函式等。要使用這些函式，需要匯入 dart:math 庫。

import 'dart:math';

void main() {
  double result = sin(45 * pi / 180);
  print(result); // 輸出：0.7071067811865475

  result = cos(135 * pi / 180);
  print(result); // 輸出：-0.7071067811865475

  result = sqrt(2);
  print(result); // 輸出：1.4142135623730951

  result = max(5, 10);
  print(result); // 輸出：10.0

  result = min(-5, -10);
  print(result); // 輸出：-10.0
}

在這個例子中，sin 函式計算了 45 度的正弦值，cos 函式計算了 135 度的餘弦值，sqrt 函式計算了 2 的平方根，max 函式計算了 5 和 10 的最大值，min 函式計算了 -5 和 -10 的最小值。

  graph LR
    A[數學運算] --> B[運算順序]
    B --> C[運算子優先順序]
    C --> D[數學函式]
    D --> E[三角函式]
    D --> F[平方根函式]
    D --> G[最大值和最小值函式]

在這個章節中，我們學習了 Dart 中的數學運算和函式。數學運算可以使用各種運算子進行，包括模運算、乘法、除法、加法和減法。Dart 會按照運算順序規則執行運算，如果需要改變運算順序，可以使用括號。Dart 的運算子優先順序規則如下：乘法和除法優先順序最高， 加法和減法優先順序次之。Dart 提供了許多數學函式，包括三角函式、平方根函式等。要使用這些函式，需要匯入 dart:math 庫。

Dart 基礎：變數、常數和型別安全

Dart 是一種強大的程式語言，讓您可以輕鬆地建立複雜的應用程式。在本章中，我們將探討 Dart 的基礎知識，包括變數、常數和型別安全。

變數

變數是用來儲存和操作資料的容器。在 Dart 中，您可以使用 int、double 等型別來宣告變數。例如：

int number = 10;

這個宣告建立了一個名為 number 的變數，型別為 int，並將其初始化為 10。

型別安全

Dart 是一種型別安全的語言，這意味著您不能將錯誤的型別指定給變數。例如：

int myInteger = 10;
myInteger = 3.14159; // 錯誤：不能將 double 指定給 int

這個程式碼會產生錯誤，因為您不能將 double 值指定給 int 變數。

num 型別

Dart 有一個名為 num 的型別，可以儲存整數和浮點數。您可以使用 num 型別來宣告變數，例如：

num myNumber;
myNumber = 10; // OK
myNumber = 3.14159; // OK

這個宣告建立了一個名為 myNumber 的變數，型別為 num，可以儲存整數和浮點數。

物件導向

在 Dart 中，所有值都是物件，包括整數和浮點數。這意味著您可以呼叫方法和存取屬性，如下所示：

10.isEven // true
3.14159.round() // 3

這個程式碼呼叫 isEven 方法和 round 方法，分別傳回 true 和 3。

練習

現在，讓我們練習一下！請將以下程式碼寫入您的 Dart 編輯器中：

void main() {
  int number = 10;
  print(number);
}

這個程式碼宣告了一個名為 number 的變數，型別為 int，並將其初始化為 10。然後，它使用 print 函式將變數的值輸出到主控臺。

變數和常數

在程式設計中，變數和常數是兩種基本的資料儲存單元。變數可以儲存不同的值，而常數則儲存不變的值。

變數

變數可以儲存不同資料型別的值，例如整數、浮點數、字串等。在 Dart 中，變數可以使用 var 關鍵字宣告，例如：

var myNumber = 10;

Dart 會根據指定的值自動推斷變數的資料型別。在上面的例子中，myNumber 會被推斷為 int 型別。

動態型別

Dart 也提供了動態型別的功能，允許變數儲存任何型別的值。然而，這種做法不被推薦，因為它可能導致程式錯誤和安全問題。

dynamic myVariable = 10;
myVariable = 3.14159;
myVariable = 'ten';

型別推斷

Dart 可以自動推斷變數的型別，無需明確宣告。例如：

var someNumber = 10;
someNumber = 15; // OK
someNumber = 3.14159; // 錯誤

在這個例子中，someNumber 會被推斷為 int 型別，因此不能指定為浮點數。

常數

Dart 有兩種常數：const 和 final。const 常數是在編譯時期就已經知道其值的常數，而 final 常數則是在執行時期才知道其值的常數。

const 常數

const 常數可以使用 const 關鍵字宣告，例如：

const myConstant = 10;

const 常數的值不能被修改，一旦宣告就不能被重新指定。

final 常數

final 常數可以使用 final 關鍵字宣告，例如：

final myFinalConstant = 10;

final 常數的值也不能被修改，但是它的值可以在執行時期才知道。例如：

final myFinalConstant = DateTime.now().millisecondsSinceEpoch;

在這個例子中，myFinalConstant 的值是在執行時期才知道的。

Dart 中的變數和常數

在 Dart 中，變數和常數是兩種基本的資料儲存單元。變數可以儲存不同的值，而常數則儲存固定的值。

常數（Constants）

Dart 中的常數可以使用 const 或 final 關鍵字宣告。const 關鍵字用於宣告編譯時期的常數，而 final 關鍵字用於宣告執行時期的常數。

const hoursSinceMidnight = DateTime.now().hour;

上述程式碼會產生錯誤，因為 DateTime.now().hour 是一個執行時期的值。為了修正這個問題，可以使用 final 關鍵字：

final hoursSinceMidnight = DateTime.now().hour;

變數（Variables）

Dart 中的變數可以使用 var 關鍵字宣告。變數可以儲存不同的值，並可以在程式執行期間修改。

var counter = 0;
counter += 1; // counter = 1
counter -= 1; // counter = 0

意義名稱（Meaningful Names）

在 Dart 中，變數和常數的名稱應該是有意義的，以便於程式的閱讀和維護。好的名稱應該能夠描述變數或常數的角色。

var personAge = 25;
var numberOfPeople = 10;
var gradePointAverage = 3.5;

命名規則（Naming Conventions）

Dart 中的變數和常數名稱應該遵循以下命名規則：

  • 以小寫字母開頭
  • 如果名稱由多個單片語成，則應該連線起來，並且每個單詞的首字母應該大寫
  • 對於縮寫，應該將其視為單詞
var sourceUrl = 'https://example.com';
var urlDescription = 'This is a URL';

練習題（Exercises）

  1. 宣告一個名為 myAge 的整數常數，並將其設為您的年齡。
  2. 宣告一個名為 averageAge 的浮點數變數，並將其初始化為您的年齡。然後，將其設為您和您最好的朋友的年齡的平均值。
  3. 宣告一個名為 testNumber 的整數常數，並將其初始化為任意整數。然後，宣告一個名為 evenOdd 的整數常數，並將其設為 testNumber 除以 2 的餘數。現在，將 testNumber 改為不同的數字。您會注意到什麼關於 evenOdd？

從技術架構視角來看，Dart 環境的設定與專案結構清晰簡潔，有效降低了開發者的入門門檻。透過 Dart SDK 提供的豐富工具，從程式碼編譯、分析到套件管理，完整涵蓋了軟體開發生命週期。同時，VS Code 等 IDE 的支援，更進一步提升了開發效率。然而，Dart 的動態型別特性雖然提供了彈性，但也可能埋下型別錯誤的隱患，需要開發者格外注意。對於重視程式碼品質的團隊，更需要善用程式碼分析工具和測試框架，才能確保應用程式的穩定性和可靠性。展望未來，隨著 Dart 生態的持續發展，預計會有更多工具和框架出現，進一步簡化開發流程，並提升 Dart 應用程式的效能表現。對於有意投入跨平臺應用開發的團隊，Dart 無疑是一個值得關注的技術選項。

玄貓

玄貓

技術愛好者，專注於分享程式開發、雲端技術與 AI 應用的心得體會。