使用Express进行Vue.js路由

我在这里创build了一个组合https://temp-portfolio.herokuapp.com 。 我的问题是,当用户刷新除index.html以外的页面或直接到另一个链接,如https://temp-portfolio.herokuapp.com/projects路由不呈现。 我已经使用Node.js和Express在Heroku按照本指南设置了一切https://medium.com/@sagarjauhari/quick-n-clean-way-to-deploy-vue-webpack-apps-on-heroku- b522d3904bc8 。

我试图重写服务器到这个https://stackoverflow.com/a/44226999/4178637,但应用程序崩溃。

server.js

var express = require('express'); var path = require('path'); var serveStatic = require('serve-static'); app = express(); app.use(serveStatic(__dirname)); var port = process.env.PORT || 5000; app.listen(port); console.log('server started '+ port); 

index.js

 import Vue from 'vue' import Router from 'vue-router' import Nav from '@/components/Nav' import Home from '@/components/Home' import Projects from '@/components/Projects' import Urban from '@/components/Urban' import Seizure from '@/components/Seizure' import Explosion from '@/components/Explosion' import Decadence from '@/components/Decadence' import Threshold from '@/components/Threshold' Vue.use(Router) Vue.component('app-nav', Nav) export default new Router({ routes: [ { path: '/', name: 'Home', component: Home }, { path: '/projects', name: 'Projects', component: Projects }, { path: '/projects/urban', name: 'Urban', component: Urban }, { path: '/projects/seizure', name: 'Seizure', component: Seizure }, { path: '/projects/explosion', name: 'Explosion', component: Explosion }, { path: '/projects/decadence', name: 'Decadence', component: Decadence }, { path: '/projects/threshold', name: 'Threshold', component: Threshold } ], mode: 'history' }) 

main.js

 import Vue from 'vue' import App from './App' import router from './router' import './assets/styles/styles.scss' Vue.config.productionTip = false new Vue({ el: '#app', router, template: '<App/>', components: { App } })