flask vue在同一服务器的解决方案

1、正常安装vue/router/cli等

2、修改frontend/src/router/index.js路由，引入新组件：

import Vue from 'vue'
import Router from 'vue-router'
const routerOptions = [
{ path: '/', component: 'Home' },
{ path: '/about', component: 'About' }
]

const routes = routerOptions.map(route => {
return {
...route,
component: () => import(`@/components/${route.component}.vue`)
}

})

Vue.use(Router)
export default new Router({
routes,
mode: 'history'
})

3、修改前端配置config/index.js

index: path.resolve(__dirname, '../dist/index.html'),
assetsRoot: path.resolve(__dirname, '../dist'),
//此处就是修改父级目录

4、构建flask web服务器，主要是制定静态文件和模板文件位置，vue的起始文件为index.html，要用render_template转过去。

from flask import Flask, render_template
app = Flask(__name__,
static_folder = "./dist/static",
template_folder = "./dist")

@app.r