簡述、以下為vue3.0 vue-cli4.0搭建工程化專案的方法,有誤地方感謝更正。
一、 安裝 腳手架
npm install @vue/cli -g 沒有指定版本則為cli最高版本
二、建立專案
三、選擇定義手動配置
四、選擇配置
五、選擇vue 版本 3.0
六、選擇模式
1.hash模式的原理(url帶有#號部分):
在vue-router.js的2.8版本之前,在路由的hash部分發生了任何變化,都會執行window.onhashchange方法,在這個方法內部我們可以根據當前匹配到的hash去載入對應的元件
在vue-router.js的2.8版本之後,內部使用window.history.pushstate來完成相應的功能
hash模式的特點:在切換路由的時候,不會向伺服器傳送請求,但是重新整理網頁的時候,此時會向伺服器傳送請求,在向伺服器傳送請求的時候,hash部分的資訊是不會傳送到伺服器的,所以此時重新整理網頁沒有問題
localhost:8888 --->載入spa單頁面應用程式
localhost:8888#index --->當localhost:8888切換到localhost:8888#index 沒有傳送請求
localhost:8888#login --->當localhost:8888#index切換到localhost:8888#login 沒有傳送請求
localhost:8888#login --->當我們直接重新整理瀏覽器的時候,此時會向伺服器傳送請求,但是我們請求url的中hash部分不會提交到伺服器,所以真正的請求位址是localhost:8888,就相當於此時重新去載入spa單頁面應用程式
2.history模式的原理(url中通過/表示路徑)
內部使用window.history.pushstate來處理url的變化,切換對應的元件
history模式的特點:在切換路由的時候,不會向伺服器傳送請求,但是當重新整理網頁的時候,此時會向伺服器傳送請求,如果後端沒有對應的介面與此匹配,此時會報資源找不到的錯誤
history模式一般情況下不能重新整理網頁
七、選擇檔案配置存放的位置
八、選擇這次的為以後的選擇嗎
九、啟動專案
十、啟動成功
Vue 3 0 學習記錄 搭建
使用vue cli的vue create 或者vue ui搭建專案 搭建專案時,需要新增vue router 以及uvex等常用模組 因為當前3.0vue專案是由vue2.0專案公升級來的,所以需要加建立專案時增加所需的模組,在將專案公升級為3.0專案是會自動修改,可以避免寫初始化 vue add ...
vue工程化管理
載入使用到的資源 最小化載入原則 編寫html css 如何從c盤到e盤 直接在cmd 輸入e 回車 projecta bindocs plugins logs package.json 記錄了你當前環境安裝的工具包有哪些 node.js nvm node的版本管理工具 npm解除安裝vue cli...
vue工程化之專案引入jquery
既然寫專案,那麼少不了用jq,那我們就引入進來吧 1 因為已經安裝了vue腳手架,所以需要在webpack中全域性引入jquery 開啟package.json檔案,在裡面加入這行 jquery後面的是版本,根據你自己需求更改。2 然後在命令列中cnpm install 大多人應該都是使用的 映象,...