Nuxt 安裝流程

阿榮
發佈於前端
閱讀時間約 1 分鐘

環境需求

  • Node:v18.0.0 或更新的版本
  • 文字編輯器:Nuxt 官方推薦 VS Code + ​Vue - Official 原 Volar 套件(已停用)

額外補充


開始安裝

有 npx / pnpm / bun 三種可選,以下使用 npx 和 npm
  1. 建立初始專案 (記得更改 project name)
npx nuxi@latest init <project-name>

下指令後,它會問你要用哪種套件管理工具: npm pnpm ... 等自選
耐心等它跑完
跑完後會問你要不要初始化 git repo (真貼心)

  1. 以編輯器開啟
code <project-name>
  1. 切換到專案資料夾
cd <project-name>
  1. 安裝相依的套件和模組
npm install
  1. 開啟專案
npm run dev -- -o


成功建立 👏🏻👏🏻👏🏻👏🏻

raw-image


參考資料

主要放程式學習筆記,分享 Creative Coding 相關內容、作品
留言0
查看全部
發表第一個留言支持創作者!
你可能也想看
Kubernetes新手必看實務流程-Part3: 安裝後的基本任務與問題排除本文將演示在安裝完 Kubernetes Cluster 後的基本元件安裝,包括 Calico/Calicoctl、Metric Server 和 Dashboard UI 的安裝方法以及相關問題與解決方式。
Thumbnail
avatar
超健忘閒人
2024-01-16
Nuxt3 - 在運行時改變「環境變數」env 環境變數的設定,通常是為為了 server 而設定的,能快速的切換狀態,但現在的網頁開始,前端的範圍逐漸往後端靠近,所以在設定,也會有 client 的變數會想要在 .env 的情況。此篇就是以 nuxt 為實作,分享此內容 前端架構 最常見的 front 架構,就是把專案 buil
Thumbnail
avatar
現代老爸要會的事
2024-01-01
[Nuxt3] 如何支援 iOS13 InApp WebView前言 近期用 Nuxt3 開發內嵌於 iOS、Android App 的網頁,並且要支援到 iOS13 版本。 測試時發現 Nuxt3 在 iOS13 功能會無法正常執行,因此順手記錄這個踩坑過程…XD 第一坑 Nuxt3 Announcing Nuxt 3 officially suppo
Thumbnail
avatar
Andy Tsou
2023-12-24
Vue3 筆記 | NuxtVue 筆記,Nuxt 簡介
Thumbnail
avatar
Jeremy Ho
2023-11-21
Nuxt3 使用 useFetch 取得數據Nuxt3中可使用useFetch來獲取數據,不須再引用axios,相當方便: 本筆記參考: https://juejin.cn/post/7104071421160063012 https://juejin.cn/post/7086472647575339045
avatar
Vic Lin
2023-03-10
Nuxt 3 動態路由比如點了商品詳細資料,會導到商品詳細資料頁面並帶上id,或者點了商品分類,將類別id帶過去抓出該類別的商品資料等等。 巢狀路由用法: 同一層page帶動態參數用法: 跳轉頁面可直接使用nuxt-link 若是要用類似v-to的用法來存取v-for的變數,要用:to 本筆記參考: https://it
Thumbnail
avatar
Vic Lin
2023-03-10
Nuxt 3 安裝與入門安裝Node.js 使用nuxi建立nuxt 3 專案: 3. 進入專案目錄後,安裝相關套件: 4. 啟動nuxt: 跟Nuxt 2用法一樣,新增一個元件放到components資料夾中,可以直接引用: pages用法也一樣,這邊把app.vue改放到pages下,改成index.vue,然後新增一
Thumbnail
avatar
Vic Lin
2023-02-17
Nuxt.js 入門1. 安裝node.js 2. 建立專案: 接著會詢問一些初始化設定的東西,按照需求選擇即可: 3. 執行 打開http://localhost:3000/ 即可看到畫面。 pages Nuxt.js會自動配置pages中每一個.vue檔案的route。 假設在pages資料夾下新增一個如下內容的a
Thumbnail
avatar
Vic Lin
2023-02-17
在 Nuxt 專案中使用 Sass 和 Vue3 Composition APINuxt.js 是以 Vue 為基底所建構的框架,透過 Nuxt.js,我們能夠更輕鬆地開發靜態頁面 (Static Site)、操作體驗良好的單頁式網站 (SPA)、甚至是顧及 SEO 的伺服器端渲染 (SSR) 網站。
Thumbnail
avatar
Ray C
2021-03-27
安裝流程有不會的都可以留言提問
Thumbnail
avatar
林書民
2019-11-14