vue-router和Express [英] vue-router and Express

问题描述

我使用vue.js和他们的vue-cli webpack构建了一个简单的应用程序。

我用vue-router来控制站点周围的导航不同的看法。这在当地运行时工作正常。

我现在想将它部署到Heroku上，但是这些URL不再有效。我尝试过实现中间件，但碰到了一堵砖墙！

我正在寻找可能导致我沿着正确的方向配置node.js / express

 对于那些处于类似情况的人，现在正在使用：
 const express = require（'express'）; 
 const history = require（'connect-history-api-fallback'）; 
 const app = express（）; 
 
 const staticFileMiddleware = express.static（__ dirname）; 
 app.use（staticFileMiddleware）; 
 app.use（history（{
 disableDotRule：true，
 verbose：true 
}））; 
 app.use（staticFileMiddleware）; 
 
 const port = 5555; 
 app.listen（port，（）=> {
 console.log（`监听端口$ {5555}！`的示例应用程序）; 
}）; 
  

您可以详细了解 connect-history-api-fallback

I've build a simple app using Vue.js and their vue-cli webpack.

I've used vue-router to control navigation around the site with the different views. This works fine when running locally.

I'm now wanting to deploy this onto Heroku, however the urls are no longer working. I've tried implementing middlewares, but have hit a brick wall!

I'm looking for something that might lead me along the right lines to configure node.js/express to run the app correctly.

Many thanks,

James

解决方案

For those in a similar situation, now working using:

const express = require('express');
const history = require('connect-history-api-fallback');
const app = express();

const staticFileMiddleware = express.static(__dirname);
app.use(staticFileMiddleware);
app.use(history({
  disableDotRule: true,
  verbose: true
}));
app.use(staticFileMiddleware);

const port = 5555;
app.listen(port, () => {
  console.log(`Example app listening on port ${5555}!`);
});

You can learn more about connect-history-api-fallback

这篇关于vue-router和Express的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！