如何切換 Node.js版本, 建立vite專案

 如何切換 Node.js版本

  • NVM 下載 - 選擇 nvm-setup.exe 安裝
    安裝成功後可以輸入nvm確認有無安裝成功，成功會出現下圖(安裝成功)

  • 輸入指令 nvm install 18.17.1 (安裝版本)
  • 切換版本 nvm use 18.17.1 (安裝版本) (nvm ls 可以查看目前有安裝的版本)
  • 確認版本 node - v

建立專案

今天我們先來建立我們的專案環境，第一步先創建專案，輸入指令 :

  • npm create vite@latest 使用 Vite 指令建立專案
  • 輸入專案名稱 ? Project name: » 專案名稱
  • 選擇你的框架 > 這邊選擇用Vue

留言

發佈留言

此網誌的熱門文章

《Clean Code 2: Vue 3 檔案/資料夾結構》

  目錄 (10 主題版) Part 1: 最簡目錄總覽 🚀 Vue 3 專案結構入門  🏗️ 元件與模組化組織  🧩 路由與頁面架構  🗺️ 狀態管理結構  🗄️ API 服務層設計  🌐 共享資源與工具  🛠️ 測試結構  🧪 特性導向結構  🏢 命名規範與原則  🏷️ 實戰範例與總結  ✨ Part 2: 詳細目錄內容 📖 第一部分：基礎與核心結構 (Foundations & Core Structure)  🏗️ Vue 3 專案結構入門與原則 為何需要清晰的檔案結構？🤔 Vue CLI/Vite 預設結構解析 🧐 src  目錄的組織策略 📁 核心目錄 ( components ,  views ,  assets ,  utils  等) 的職責 🗂️ 元件與模組化組織的最佳實踐 元件的職責劃分與拆分 🧩 單檔案元件 (SFC) 的結構規範 📝 組織元件目錄 ( components ,  ui ,  layout  等) 🌳 共享元件與複合元件的區分 🤝 路由與頁面架構的最佳實踐 vue-router  配置與目錄結構 🗺️ 頁面 (Views/Pages) 與佈局 (Layouts) 的組織 🏘️ 動態路由與嵌套路由的結構化 🧭 路由守衛與權限管理的結構化 🛡️ 狀態管理結構 (Vuex/Pinia) Pinia Store 的模組化結構建議 🗄️ Vuex Modules 的組織方式 📦 Actions, Mutations, Getters 的邏輯劃分 🗃️ 狀態共享與跨 Store 依賴管理 🌐 API 服務層設計與組織 建立專門的 API 服務目錄 ( services ,  api ) 📡 Axios/Fetch 的封裝與配置 🌐 錯誤處理、響應格式統一與 Mock API 結構 ⚠️🎭 第二部分：進階組織與實踐 (Advanced Organization & Practices)  🚀 共享資源與工具的結構化 utils ,...
閱讀更多

[Laravel][ATOMIC] DB::transaction, DB::beginTransaction

  DB::beginTransaction()   will only begin a transaction, while for   DB::transaction()   you must pass a Closure function that will be executed   inside   a transaction. So this: DB:: transaction ( function () { // Do something and save to the db... }); is the same as this: // Open a try/catch block try { // Begin a transaction DB:: beginTransaction (); // Do something and save to the db... // Commit the transaction DB:: commit (); } catch (\ Exception $e ) { // An error occured; cancel the transaction... DB:: rollback (); // and throw the error again. throw $e ; } As you can see,  DB::transaction()  is a "helper" function to avoid writing code to catch errors, begin a transaction, commit the transaction, and optionally rollback (cancel the transaction) if an error occured. If you have a more complex logic, or need an specific behaviour, you will manually build your transaction; if your lo...
閱讀更多

[laravel 9] rename project

  Answers Sorted by:                                                Highest score (default)                                                                     Trending (recent votes count more)                                                                     Date modified (newest first)                        ...
閱讀更多