vue-router改為history模式

yunhao 發布于2019-08-23 10:52 / 1199人閱讀

摘要：打包好后本地測試運行是否正常環境搭建這個時候需要利用中的方法如下安裝最新版本中將命令工具分家出來了還需要安裝一個命令工具創建一個工程進入項目主目錄安裝必備包啟動程序把打包后的文件夾放在文件夾里訪問就能看到項目了這樣測試好了后就可以丟后

打包好后本地測試運行是否正常
環境搭建：

這個時候需要利用node中的express,方法如下:
安裝express: npm install -g express;
最新express4.0版本中將命令工具分家出來了,還需要安裝一個命令工具: npm install -g express-generator;
創建一個express工程: express helloworld;
進入項目主目錄: cd helloworld;
安裝必備包: npm install;
啟動程序: npm start;
把打包后的dist文件夾放在public文件夾里,訪問http://localhost:3000/dist就能看到項目了,這樣測試好了后,就可以丟后臺了

存在問題：提示css文件和mainfest.js文件404，且提示webpack.jsonp is undefined(這個錯誤是由于mainfest.js文件404導致，因為app.js和其他的js文件用到了webpack.jsonp，但是他是在mainfest中定義的)
解決404問題：在config文件夾中的index.js中設置一個路徑問題,不然也會報錯,在js中找到build:{assetsPublicPath: "./"},默認路徑是"/",需要加上"."

相關參考鏈接： https://www.jb51.net/article/...

         https://blog.csdn.net/GossipHHH/article/details/78749308

route使用history模式，去掉鏈接里的#號
踩過的坑：

1.

這樣配置
這里assetsPublicPsth寫成‘./’(是在當前目錄下去找靜態文件)，導致刷新頁面或者直接訪問頁面localhost:3000/versionflow/mychange的時候提示資源文件404

**原因： ./ 代表的是去當前目錄下找靜態文件，所以程序會在public/versionflow下去找靜態文件，但是并沒有versionflow這個文件夾，所以會提示404（根目錄為public）**


2.

這樣配置，直接訪問就提示找不到靜態資源404，

算了不寫了，千坑萬坑都是自己親手挖的

正確寫法

assetsSubDirectory設置的文件需要能夠在根目錄(需要在哪個目錄下找是根據assetsPublicPath的設置決定的)下找到
地基沒有打牢，重新打一下地基

=========================================轉載
首先要說的是 ./ ../ /
/ 取根目錄:
file:///
./ 取當前目錄:
file:///Users/xxx/Documents/projects/outsourcing/youreact/dist/
../ 取當前目錄的上一層目錄:
file:///Users/xxx/Documents/projects/outsourcing/youreact/

assetsRoot:構建輸出目錄也就是構建后的東西都扔這里
assetsSubDirectory:資源子目錄除了index.html，其余的js img css都分在這里
assetsPublicPath:項目目錄一個杠杠啥意思呢，是根目錄的意思

作者：懶先森
鏈接：https://www.jianshu.com/p/947...
來源：簡書
簡書著作權歸作者所有，任何形式的轉載都請聯系作者獲得授權并注明出處。

GPU云服務器云服務器 vue-router history history back history linux

文章版權歸作者所有，未經允許請勿轉載,若此文章存在違規行為，您可以聯系管理員刪除。

轉載請注明本文地址：http://specialneedsforspecialkids.com/yun/96766.html

Vue-router History模式下，空白頁面，如何配置tomcat服務器

摘要：頁面剛用開發項目沒多久，很多時間都在坑里慢慢摸索，今天要填的坑是在開啟模式后，直接進入路由子目錄，頁面會報。模式配置文檔中寫了和服務器如何配置，這里添加一下服務器里使如何配置的。結束到此結束，此致敬禮頁面404 剛用vue開發項目沒多久，很多時間都在坑里慢慢摸索，今天要填的坑是在vue-router開啟history模式后，直接進入路由子目錄，頁面會報404。為什么呢，原因很簡單。因...

EddieChan 2019-08-20 18:20 評論0 收藏0
Vue Router history模式的配置方法及其原理

摘要：但如果要使用模式，我們需要在后端進行額外配置。模式的配置方法我們來看看官方文檔是教我們怎么配置的模式。模式的配置實踐及原理強烈建議閱讀這部分之前，先看一下的這部分文檔和這部分文檔。只配置前端的情況首先，我們將設置為，但不配置后端。始發于我的博客 ryougifujino.com，歡迎訪問留言。 vue-router分為hash和history模式，前者為其默認模式，url的表現形式為...

Richard_Gao 2019-08-30 11:04 評論0 收藏0
history和hash，vue-router

摘要：另外該事件只針對同一個文檔，如果瀏覽歷史的切換，導致加載不同的文檔，該事件不會被觸發使用的時候，可以為事件指定回調函數或者回調函數的參數是一個事件對象，它的屬性指向和方法為當前所提供的狀態對象即這兩個方法的第一個參數。 history window.history(可直接寫成history)指向History對象，它表示當前窗口的瀏覽歷史。History對象保存了當前窗口訪問過的所有頁...

godiscoder 2019-08-23 18:07 評論0 收藏0