跳至主要內容
版本：v8

開發提示

解決權限錯誤​

當全域安裝套件時，可能會發生 EACCES 權限錯誤。 如果是這種情況，可能需要設定 npm 以在沒有提升權限的情況下運作。

注意

不建議使用 sudo 與 npm，因為它可能導致進一步的複雜情況。

本指南提供兩種解決權限問題的選項。 請參閱npm 文件以取得完整文件和其他選項。

選項 1​

避免權限問題的最佳方法是使用節點版本管理器重新安裝 NodeJS 和 npm。

本指南將記錄 nvm 的安裝和使用。 請參閱 nvm 文件以取得完整文件。 請參閱 npm 文件以取得 Windows 的其他選項和說明。

  1. 安裝 nvm。

    $ curl -o- https://raw.githubusercontent.com/nvm-sh/nvm/v0.34.0/install.sh | bash

  2. 新的終端機現在將使用 nvm。 若要驗證，請開啟新的終端機並執行以下命令。 如果印出任何內容，則表示安裝成功。

    $ command -v nvm

  3. 若要下載並安裝最新 LTS 版本的 NodeJS，請執行

    $ nvm install --lts

  4. 將新安裝的 NodeJS 設定為預設環境

    $ nvm alias default lts/*

  5. 新的終端機現在將使用受 nvm 控制的 NodeJS。 若要驗證

    $ node -v  # will print the version installed above
    $ which npm  # will print a path somewhere within the ~/.nvm folder

全域套件現在將安裝在 ~/.nvm 目錄中，因此只要在不使用 sudo 的情況下使用 npm，就不會再發生權限錯誤。

選項 2​

不適用於 Windows

將 npm 目錄的所有者變更為目前使用者

$ sudo chown -R $(whoami) /usr/local/{lib/node_modules,bin,share}
$ sudo chown -R $(whoami) /usr/lib/node_modules
$ sudo chown -R $(whoami) ~/.npm ~/.npmrc

由於這些全域目錄不再由 root 擁有，因此可以在不使用 sudo 的情況下全域安裝套件。

更新相依性​

若要更新 npm 相依性，請執行以下命令，其中 <package-name> 是要更新的套件

npm install <package-name>@<version|latest> --save

例如，若要將 @ionic/angular 套件更新至標記為 latest 的版本，請執行

npm install @ionic/angular@latest --save

建議透過 CLI 更新套件，因為 npm 現在會先從 package-lock.json 讀取套件版本。

程式碼編輯器​

有很多程式碼編輯器可供選擇。 以下是我們最喜歡的一些

  • Visual Studio Code：由 Microsoft 製作的熱門免費文字編輯器
  • Atom：由 GitHub 製作的可修改的文字編輯器
  • WebStorm：JetBrains 提供的功能強大的非免費編輯器

使用偵錯工具​

debugger 關鍵字可用於偵錯應用程式。 當大多數瀏覽器遇到 debugger 陳述式時，JavaScript 的執行會停止，而瀏覽器會載入其偵錯工具。 這可用於在應用程式中設定「中斷點」。

例如，如果函式未傳回正確的值，則可以使用偵錯工具逐步執行程式碼並檢查變數。

function myBrokenFunction() {
  debugger;
  // do other stuff
}

當應用程式執行時，它會在該函式處暫停。 從那裡，可以使用開發人員工具逐行執行 JavaScript，並檢查函式在哪裡發生錯誤。

變更模式​

預設情況下，當在瀏覽器中檢視應用程式時，Ionic 會套用 md 模式。 但是，由於 Ionic 元件會根據其平台進行調整，因此能夠檢視應用程式在 iOS 上的外觀會很有幫助。 若要執行此操作，請將 ?ionic:mode=ios 新增至應用程式正在提供服務的 URL。 例如，如果應用程式在連接埠 8100 上提供服務，則 URL 將為： https://127.0.0.1:8100/?ionic:mode=ios。

注意

這不會變更瀏覽器看到的平台使用情況。 平台由裝置偵測和檢查使用者代理程式來決定。 若要變更平台，必須變更使用者代理程式。 若要執行此操作，請使用 Ctrl+Shift+I (Cmd+Option+I 在 Mac 上) 開啟 Chrome DevTools，然後使用 Ctrl+Shift+M (Cmd+Option+M 在 Mac 上) 開啟裝置模式。

Chrome DevTools showing the device mode with iPhone X selected.

從裝置下拉式選單中選取裝置將會變更使用者代理程式，以及檢視區的尺寸。

使用 iOS 模擬器​

iOS 模擬器可讓您在應用程式到達實際裝置之前進行測試和偵錯。

在使用之前，必須安裝 Apple 的 IDE Xcode。

然後可以使用Ionic CLI在模擬器上執行目前目錄中的應用程式

ionic cordova emulate ios -lc

傳遞 -lc 旗標將會啟用即時重新載入，並將主控台輸出記錄到終端機。

Xcode 也可用於啟動模擬器並偵錯應用程式。

開啟 Xcode 並開啟 ../path-to-app/platforms/ios/myApp.xcodeproj。

應用程式載入後，主控台輸出和裝置記錄將會印在 Xcode 的輸出視窗中。

使用 Genymotion Android 模擬器​

雖然 Android SDK 隨附了預設模擬器，但有時可能會很慢且沒有反應。

Genymotion 是另一個更快的模擬器，並且仍然可以存取原生功能，例如 GPS 和相機。

目錄

編輯此頁面