flask + vue
1. flask 只能加载静态文件,意思是说,flask 不能加载*.vue 文件,我们需要通过npm run build 将*.vue 文件转换成静态的*.js 文件
2. flask 目录
flask/
flask/app/app.py
flask/web/ -- 我们在flask目录下,用命令 “vue create web” 生成web 目录
3. 安装vue-cli
3.1 install node.js
download link: https://nodejs.cn/download/ (use the state version 20.17.0)
3.2 check the result of installation
node -v
npm -v
3.3 install vue-cli
npm install -g @vue/cli
4. 生成 web
vue create web -- 生成默认的web 程序
5. 生成静态的js文件
npm run build -- web目录下会新生成一个dist的目录
6. 修改flask/app/app.py 程序中的static_folder,static_url_path,template_folder
from flask import Flask, send_from_directory, render_template
app = Flask(__name__, static_folder='../web/dist', static_url_path='', template_folder='../web/dist')
@app.route('/')
def home():
return render_template("index.html")
if __name__ == '__main__':
app.run(debug=True)
7. run app.py
python app.py
8. 访问server
在浏览器上输入127.0.0.1:5000
原文地址:https://blog.csdn.net/shangtaobocdns/article/details/142427043
免责声明:本站文章内容转载自网络资源,如本站内容侵犯了原著者的合法权益,可联系本站删除。更多内容请关注自学内容网(zxcms.com)!