且构网

分享程序员开发的那些事...
且构网 - 分享程序员编程开发的那些事

我应该如何组织代码的后端和前端?

更新时间:2021-10-07 23:41:52

如果您想为后端和前端应用程序保留一个 Github 存储库,我可以建议以下步骤

If you want to keep one Github repos for both backend and frontend application I can suggest the steps below

  1. 您可以在 Flask 应用程序中创建名为 client 的文件夹,并将所有 Vue 项目移动到该文件夹​​中.

  1. You can create folder named client inside the Flask application and move all of the Vue project to that folder.

在客户端文件夹(Vue App)中,在vue.config.js文件中添加outputDir参数如下

In the client folder(Vue App), add outputDir parameter inside vue.config.js file as follows

const path = require('path');

module.exports = {
  outputDir: path.resolve(__dirname, '../dist'),
}

  1. 要在 Flask 应用程序中创建 dist 文件夹以提供服务,请转到客户端文件夹并根据您的包管理器运行 npm run buildyarn build.

run.py 文件中,添加此代码以提供 Vue App

In the run.py file, add this code to serve Vue App

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

@app.route('/')
def index():
    return render_template("index.html")

结构可以根据您的 Flask Application 应用程序配置而改变,但我认为它可以给您提供思路.

The constructions can change according to your application configurations of Flask Application but I think it can give you the idea.

查看这篇文章 了解更多.