處理vue打包路由為history模式的刷新問題


1.核心npm包 connect-history-api-fallback

npm install --save connect-history-api-fallback

1.1這里使用koa擴展的包 koa-connect-history-api-fallback

npm install --save koa-connect-history-api-fallback

2.完整代碼

  注意app.use(history());必須在創建app對象之后就引入,不能在koa靜態資源之后

let prot = 3000; // 服務端口號
// 引入模塊           
const Koa = require('koa');
const history = require('koa-connect-history-api-fallback');    //解決前端路由是history刷新問題
//const router = require('koa-router')(); /*引入是實例化路由 推薦*/
const bodyParser = require('koa-bodyparser');    //處理post請求時得到的body數據格式
const static = require('koa-static'); //靜態資源中間件
 
// 實例化
let app = new Koa();

// 配置常用的中間件
app.use(history());
app.use(bodyParser());    //post bodyparser
app.use(static(__dirname + '/public')); // koa靜態資源中間件可以配置多個
//app.use(static(__dirname + '/static')); // koa靜態資源中間件可以配置多個

app.listen(prot,() => {
    console.log("localhost:" + prot);
});

3.終極解決方案 配置nginx服務

 


免責聲明!

本站轉載的文章為個人學習借鑒使用,本站對版權不負任何法律責任。如果侵犯了您的隱私權益,請聯系本站郵箱yoyou2525@163.com刪除。



 
粵ICP備18138465號   © 2018-2025 CODEPRJ.COM