👆建議你可以使用影片子母畫面功能或全螢幕播放來獲得最佳的觀賞體驗,👇下方是本篇教學的相關筆記。
Node.js - 建議安裝 v18 版本以上
VS Code - 可以安裝 Volar 插件的文字編輯器
Vue Language Features (Volar) 插件 - 強烈建議 Nuxt 與 Vue 開發者安裝
node -v
初始化建立一個 Nuxt 3 專案。專案名為 nuxt-app
npx nuxi@latest init nuxt-app
npm run dev
<template>
<div>
<h1>2023 iThome 鐵人賽</h1>
</div>
</template>
<style scoped>
h1 {
color: blue;
}
</style>
感謝大家的閱讀,歡迎大家給予建議與討論,也請各位大大鞭小力一些:)
如果對這個 Nuxt 3 系列感興趣,可以訂閱
接收通知,也歡迎分享給喜歡或正在學習 Nuxt 3 的夥伴。
參考資料
您好,請問一下建立專案會出現以下錯誤:
Error: Failed to download template from registry: Invalid URL
試著依照搜尋的方法在hosts加入:
185.199.108.133 raw.githubusercontent.com
還是無法解決,可以指導一下嗎?謝謝。
嗨,您好
依據錯誤在網路上尋找到的資料,看起來是因為您的網路環境 DNS 無法正常解析所列網域或是可能有封鎖的情形,
看您的描述也依據網路上提供的方法,設定 hosts 讓該網域 raw.githubusercontent.com 直接解析成 185.199.108.133,
不過看起來您仍然無法正常運作。
建議您可以依據下列逐步檢查,確認您的網路環境是否有封鎖或是 DNS 解析異常的情形:
首先 Node 的版本建議在 v18 以上,可以使用 node -v
來檢查一下
其中也會包含你所設定在 hosts 的 IP 185.199.108.133,如果 IP 不相同則說明您可能設定有誤
2. 您也可以直接嘗試修改 DNS 來試試看不同的解析伺服器,看是否能正常的解析出 IP,可以先使用 dig raw.githubusercontent.com @8.8.8.8
指令來嘗試使用 Google DNS 來解析網域,如果有成功應該會看到 185.199.111.133 IP,那麼您就可以嘗試使用這個 DNS
3. 如果上述步驟都沒有問題,接著可以嘗試直接瀏覽這個網址 raw.githubusercontent.com 應該會導回至 GitHub 的首頁
4. 如果 ping 到 185.199.108.133 的指令沒有回應或是無法瀏覽 raw.githubusercontent.com,有可能您的網路環境有針對 IP 封鎖的設定,您可以嘗試檢查防火牆或網路環境的相關設定
5. 如果無法碰觸到防火牆等出口請求限制,可以嘗試更換網路環境或是使用 VPN、Proxy 的方式來進行
這是目前我能找得到的資訊與想到的測試與解法,如果真的還是不行,您也可以先嘗試直接使用 npm install 直接安裝 nuxt,或直接從系列文章中的專案原始碼來直接開始進行開發,不過這樣可能仍無法使用 npx 的相關模板指令,請您自行斟酌。
https://github.com/ryanchien8125/ithome-2023-ironman-nuxt3-video/tree/day04/nuxt-app-tailwindcss