我正在尝试将flask / vue应用程序部署到heroku,但是遇到了困难。
我主要遵循了这些说明(https://medium.com/the-andela-way/deploying-a-python-flask-app-to-heroku-41250bda27d0),并尝试遵循此Heroku deployment confusion: Vue.js frontend with Flask backend,但没有达到要求。
我遵循的步骤
我从test.py文件的根目录My_app_folder开始,并激活了虚拟环境“ my-venv”
然后:
我还创建并运行了以下buildpack:
heroku buildpacks:add --index 1 heroku/nodejs
然后在package.json的“脚本”中添加以下行:
"heroku-prebuild": "npm install",
"heroku-postbuild": "webpack --config webpack.dev.js"
这是我的package.json
{
"name": "sample-proj",
"version": "0.1.0",
"private": true,
"scripts": {
"serve": "vue-cli-service serve",
"build": "vue-cli-service build",
"lint": "vue-cli-service lint",
"heroku-prebuild": "npm install",
"heroku-postbuild": "webpack --config webpack.dev.js"
},
"dependencies": {
"@fortawesome/fontawesome-svg-core": "^1.2.28",
"@fortawesome/free-solid-svg-icons": "^5.13.0",
"@fortawesome/vue-fontawesome": "^0.1.9",
"axios": "^0.19.2",
"bootstrap": "^4.4.1",
"bootstrap-vue": "^2.6.1",
"core-js": "^3.6.4",
"js-cookie": "^2.2.1",
"require-vuejs": "^1.1.3",
"v-slider": "^1.0.0",
"vue": "^2.6.11",
"vue-range-component": "^1.0.3",
"vue-range-slider": "^0.6.0",
"vue-router": "^3.1.5",
"vue-simple-alert": "^1.1.1",
"vuex": "^3.3.0",
"vuex-persist": "^2.2.0",
"vuex-persistedstate": "^3.0.1"
},
"devDependencies": {
"@vue/cli-plugin-babel": "~4.2.0",
"@vue/cli-plugin-eslint": "~4.2.0",
"@vue/cli-service": "~4.2.0",
"babel-eslint": "^10.0.3",
"eslint": "^6.7.2",
"eslint-plugin-vue": "^6.1.2",
"node-sass": "^4.13.1",
"sass-loader": "^8.0.2",
"vue-template-compiler": "^2.6.11"
},
"eslintConfig": {
"root": false,
"env": {
"node": true
},
"extends": [
"plugin:vue/essential",
"eslint:recommended"
],
"parserOptions": {
"parser": "babel-eslint"
},
"rules": {}
},
"browserslist": [
"> 1%",
"last 2 versions"
]
}
在我的test.py脚本中,我有:
app = Flask(__name__, static_folder = "static", template_folder = "Templates/vue_template")
这是我的应用程序的结构
My_app_folder
| package.json
| Procfile
| requirements.txt
| test.py
+---frontend
| \---sample-proj
| | .gitignore
| | babel.config.js
| | package-lock.json
| | package.json
| | README.md
| | vue.config.js
| \---public
| | favicon.ico
| | index.html
| \---node_modules
| \---src
| | App.vue
| | main.js
| | router.js
| | \---assets
| | | logo.png
| | \---components
| | | AddProduct.vue
| | | category.vue
| | | HelloWorld.vue
| | | susScore.vue
| | \---Views
| | | AddProductView.vue
| | | createlist.vue
| | | grocerylist.vue
| | | loginpage.vue
+---static
| \---css
| \---img
| \---js
+---Templates
| \---vue_template
| | \---favicon.ico
| | \---index.html
我在两个地方都有package.json,因为我收到以下错误消息,并将package.json放在test.py附近解决了该错误:
The 'heroku/nodejs' buildpack is set on this application, but was unable to detect a Node.js codebase.
A Node.js app on Heroku requires a 'package.json' at the root of the directory structure.")
这些是按照上述步骤运行“ heroku logs --tail”后收到的错误消息。
26T15:28:53.000000+00:00 app[api]: Build started by user
2020-06-26T15:30:45.878824+00:00 app[api]: Deploy 9c824365 by user
2020-06-26T15:30:45.878824+00:00 app[api]: Release v14 created by user
2020-06-26T15:30:46.655593+00:00 heroku[web.1]: State changed from down to starting
2020-06-26T15:30:59.195699+00:00 heroku[web.1]: Starting process with command `npm install; npm run dev; gunicorn test:app`
2020-06-26T15:31:08.000000+00:00 app[api]: Build succeeded
2020-06-26T15:31:08.495145+00:00 app[web.1]: npm WARN bootstrap@4.5.0 requires a peer of jquery@1.9.1 - 3 but none is installed. You must install peer dependencies yourself.
2020-06-26T15:31:08.495623+00:00 app[web.1]:
2020-06-26T15:31:08.707457+00:00 app[web.1]: audited 1421 packages in 7.272s
2020-06-26T15:31:09.938506+00:00 app[web.1]:
2020-06-26T15:31:09.938521+00:00 app[web.1]: 3 packages are looking for funding
2020-06-26T15:31:09.938522+00:00 app[web.1]: run `npm fund` for details
2020-06-26T15:31:09.938522+00:00 app[web.1]:
2020-06-26T15:31:09.939188+00:00 app[web.1]: found 0 vulnerabilities
2020-06-26T15:31:09.939189+00:00 app[web.1]:
2020-06-26T15:31:11.091549+00:00 app[web.1]: npm ERR! missing script: dev
2020-06-26T15:31:11.151505+00:00 app[web.1]:
2020-06-26T15:31:11.151820+00:00 app[web.1]: npm ERR! A complete log of this run can be found in:
2020-06-26T15:31:11.151997+00:00 app[web.1]: npm ERR! /app/.npm/_logs/2020-06-26T15_31_11_092Z-debug.log
2020-06-26T15:31:11.450019+00:00 app[web.1]: [2020-06-26 15:31:11 +0000] [34] [INFO] Starting gunicorn 20.0.4
2020-06-26T15:31:11.450577+00:00 app[web.1]: [2020-06-26 15:31:11 +0000] [34] [INFO] Listening at: http://0.0.0.0:19276 (34)
2020-06-26T15:31:11.450696+00:00 app[web.1]: [2020-06-26 15:31:11 +0000] [34] [INFO] Using worker: sync
2020-06-26T15:31:11.454931+00:00 app[web.1]: [2020-06-26 15:31:11 +0000] [37] [INFO] Booting worker with pid: 37
2020-06-26T15:31:11.983153+00:00 heroku[web.1]: State changed from starting to up
2020-06-26T15:32:38.550577+00:00 app[web.1]: 10.29.86.227 - - [26/Jun/2020:15:32:38 +0000] "GET / HTTP/1.1" 200 1065 "-" "Mozilla/5.0 (Windows NT 10.0; Win64; x64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/83.0.4103.116 Safari/537.36"
2020-06-26T15:32:38.557399+00:00 heroku[router]: at=info method=GET path="/" host=garemo1-api-heroku.herokuapp.com request_id=0f61456b-6fb1-47d9-9e5d-190c94ba4a80 fwd="94.137.125.198" dyno=web.1 connect=0ms service=12ms status=200 bytes=1227 protocol=https
2020-06-26T15:32:38.692120+00:00 app[web.1]: 10.29.86.227 - - [26/Jun/2020:15:32:38 +0000] "GET /static/css/app.37905c57.css HTTP/1.1" 404 232 "https://garemo1-api-heroku.herokuapp.com/" "Mozilla/5.0 (Windows NT 10.0; Win64; x64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/83.0.4103.116 Safari/537.36"
2020-06-26T15:32:38.694490+00:00 app[web.1]: 10.33.250.117 - - [26/Jun/2020:15:32:38 +0000] "GET /static/css/chunk-vendors.32e65282.css HTTP/1.1" 404 232 "https://garemo1-api-heroku.herokuapp.com/" "Mozilla/5.0 (Windows NT 10.0; Win64; x64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/83.0.4103.116 Safari/537.36"
2020-06-26T15:32:38.698935+00:00 heroku[router]: at=info method=GET path="/static/css/app.37905c57.css" host=garemo1-api-heroku.herokuapp.com request_id=c8f8e2ee-75c5-4d15-910b-256b65f83d13 fwd="94.137.125.198" dyno=web.1 connect=0ms service=2ms status=404 bytes=400 protocol=https
2020-06-26T15:32:38.709886+00:00 heroku[router]: at=info method=GET path="/static/css/chunk-vendors.32e65282.css" host=garemo1-api-heroku.herokuapp.com request_id=b8657054-8e04-44bf-a3c2-e2e8af7ee15e fwd="94.137.125.198" dyno=web.1 connect=0ms service=1ms status=404 bytes=400 protocol=https
2020-06-26T15:32:38.807810+00:00 app[web.1]: 10.29.86.227 - - [26/Jun/2020:15:32:38 +0000] "GET /static/js/app.765edbcb.js HTTP/1.1" 404 232 "https://garemo1-api-heroku.herokuapp.com/" "Mozilla/5.0 (Windows NT 10.0; Win64; x64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/83.0.4103.116 Safari/537.36"
2020-06-26T15:32:38.811269+00:00 app[web.1]: 10.33.250.117 - - [26/Jun/2020:15:32:38 +0000] "GET /static/js/chunk-vendors.b338db17.js HTTP/1.1" 404 232 "https://garemo1-api-heroku.herokuapp.com/" "Mozilla/5.0 (Windows NT 10.0; Win64; x64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/83.0.4103.116 Safari/537.36"
2020-06-26T15:32:38.814797+00:00 heroku[router]: at=info method=GET path="/static/js/app.765edbcb.js" host=garemo1-api-heroku.herokuapp.com request_id=da71bbcc-d4fa-462a-b1de-b2064b58170d fwd="94.137.125.198" dyno=web.1 connect=0ms service=2ms status=404 bytes=400 protocol=https
2020-06-26T15:32:38.820860+00:00 heroku[router]: at=info method=GET path="/static/js/chunk-vendors.b338db17.js" host=garemo1-api-heroku.herokuapp.com request_id=d3a3b311-fe1c-4b8b-bc28-44fc0964de4a fwd="94.137.125.198" dyno=web.1 connect=0ms service=2ms status=404 bytes=400 protocol=https
2020-06-26T15:32:38.931285+00:00 app[web.1]: 10.33.250.117 - - [26/Jun/2020:15:32:38 +0000] "GET /static/js/app.765edbcb.js HTTP/1.1" 404 232 "https://garemo1-api-heroku.herokuapp.com/" "Mozilla/5.0 (Windows NT 10.0; Win64; x64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/83.0.4103.116 Safari/537.36"
2020-06-26T15:32:38.940610+00:00 heroku[router]: at=info method=GET path="/static/js/app.765edbcb.js" host=garemo1-api-heroku.herokuapp.com request_id=8c425e66-b016-4ba3-b310-77adafda192d fwd="94.137.125.198" dyno=web.1 connect=0ms service=2ms status=404 bytes=400 protocol=https
2020-06-26T15:44:34.354407+00:00 heroku[router]: at=info method=GET path="/static/css/app.37905c57.css" host=garemo1-api-heroku.herokuapp.com request_id=e990d878-4e51-4820-850b-63fb04c16441 fwd="94.137.125.198" dyno=web.1 connect=1ms service=2ms status=404 bytes=400 protocol=https
2020-06-26T15:44:34.345656+00:00 app[web.1]: 10.63.192.219 - - [26/Jun/2020:15:44:34 +0000] "GET /static/css/app.37905c57.css HTTP/1.1" 404 232 "-" "Mozilla/5.0 (Windows NT 10.0; Win64; x64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/83.0.4103.116 Safari/537.36"
2020-06-26T16:21:19.035914+00:00 heroku[web.1]: Idling
2020-06-26T16:21:19.039332+00:00 heroku[web.1]: State changed from up to down
2020-06-26T16:21:20.166771+00:00 heroku[web.1]: Stopping all processes with SIGTERM
2020-06-26T16:21:20.196557+00:00 app[web.1]: [2020-06-26 16:21:20 +0000] [34] [INFO] Handling signal: term
2020-06-26T16:21:20.255333+00:00 heroku[web.1]: Process exited with status 143
这是我尝试使用上述过程进行部署后出现在控制台中的错误的一部分
https://garemo1-api-heroku.herokuapp.com/static/css/app.37905c57.css net::ERR_ABORTED 404 (NOT FOUND)
问题
我该如何解决错误,以便我可以部署我的应用?