将Flask+Vue应用程序部署到heroku时出错

2024-05-14 15:37:14 发布

您现在位置:Python中文网/ 问答频道 /正文

我正在尝试将我的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_文件夹中启动并激活了一个虚拟环境“My venv”
然后:

  1. 登录到heroku
  2. 已安装的gunicorn
  3. ran pip冻结>;requirements.txt
  4. 创建程序文件;web:npm安装;npm运行开发;gunicorn测试:应用程序
  5. 使用“heroku创建garemo1 api heroku”创建应用程序“garemo1”
  6. ran:git-add
  7. ran:git commit-m“committed”
  8. ran:git push heroku大师

我还创建并运行了以下构建包:

 heroku buildpacks:add --index 1 heroku/nodejs

然后在package.json的“scripts”中添加了以下行:

"heroku-prebuild": "npm install",
"heroku-postbuild": "webpack --config webpack.dev.js"

这是我的包。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)

问题
如何解决错误,以便部署我的应用程序


Tags: httpscomapiappnpmgetherokuservice

热门问题