vue3 0 學習筆記

2021-10-20 08:23:20 字數 1122 閱讀 2056

今天是2023年2月26日

學習一下vue3.0雖然已經出來這麼長時間了,但是還沒有認真的學習過,只是懂一點皮毛

接下來開始我的3.0之旅 來吧!展示!藍色海… 嘿嘿嘿

第一步 安裝

(先瞅瞅你的vue -v 是多少)

npm install -g @vue/cli
第二步 初始化 專案

這裡我們選擇 manually select features(手動選擇功能):

把需要的都選上 這些都是開發需要用到的

為了節省時間勾選 router 和 vuex,避免手動寫初始化**(就是懶) 之後一頓回車就ok

下一步 公升級 vue 3.0 專案

目前建立 vue 3.0 專案需要通過外掛程式公升級的方式來實現,

vue-cli 還沒有直接支援,我們進入專案目錄,並輸入以下指令:

cd vue-next-test

vue add vue-next

執行上述指令後,會自動安裝 vue-cli-plugin-vue-next 外掛程式(檢視專案**),該外掛程式會完成以下操作:

安裝 vue 3.0 依賴

更新 vue 3.0 webpack loader 配置,使其能夠支援 .vue 檔案構建(這點非常重要)

建立 vue 3.0 的模板**

自動將**中的 vue router 和 vuex 公升級到 4.0 版本,如果未安裝則不會公升級

自動生成 vue router 和 vuex 模板**

完成上述操作後,專案正式公升級到 vue 3.0,

下一步 啟動(好激動好激動)

TS和vue3 0學習筆記

安裝ts npm install typescript g 執行 1 需要先轉成js檔案 tsc demo01.ts生成乙個js檔案 然後再執行js檔案 node demo01.js 2 安裝npm install g ts node,可直接用 ts node demo01.ts 進行編譯 定義資料...

Vue3 0學習記錄

composition api 組合api 效能提公升 viteoptions api composition api 響應式系統公升級 vue.js 3.0中使用proxy物件重寫響應式系統 proxy物件效能本身就比 defineproperty好 物件可以攔截物件的賦值 刪除等,不需要初始化遍...

vue3 0前端學習

1 響應系統公升級 vue.js 3.0 中使用proxy物件重寫響應式系統 可以監聽動態新增的屬性 可以監聽刪除的屬性 可以監聽陣列的索引和length屬性 2 編譯優化 vue.js 2.x 中,模板首先被編譯為render函式,構建過程中完成,會編譯靜態根節點和靜態子節點,當元件狀態發生變化時...