如何让 Heroku 为 Flask 应用程序运行 webpack？

Question

我正在尝试将我的测试 Flask 应用程序部署到 Heroku。除了前端，一切都在工作。我使用由 webpack 构建的 Vuejs。

我的档案：

web: npm install; npm run dev; gunicorn app:app

我的 package.json：

{
    "name": "test",
    "version": "1.0.0",
    "description": "",
    "scripts": {
        "build": "webpack --config webpack.dev.js",
        "heroku-postbuild": "webpack --config webpack.dev.js"
    },
    "keywords": [],
    "author": "",
    "devDependencies": {
        "clean-webpack-plugin": "^0.1.19",
        "css-loader": "^1.0.0",
        "html-loader": "^0.5.5",
        "node-sass": "^4.9.3",
        "sass-loader": "^7.1.0",
        "style-loader": "^0.23.0",
        "vue-loader": "^15.4.2",
        "vue-template-compiler": "^2.5.17",
        "webpack": "^4.19.0",
        "webpack-cli": "^3.1.0",
        "webpack-merge": "^4.1.4"
    },
    "dependencies": {
        "@fortawesome/fontawesome-free": "^5.3.1",
        "axios": "^0.18.0",
        "bootstrap": "^4.1.3",
        "file-loader": "^2.0.0",
        "jquery": "^3.3.1",
        "jquery.easing": "^1.4.1",
        "lodash": "^4.17.11",
        "moment": "^2.22.2",
        "popper.js": "^1.14.4",
        "vue": "^2.5.17",
        "vue-router": "^3.0.1",
        "vuex": "^3.0.1",
        "webpack": "^4.19.0"
    }
}

输出根本没有显示它运行 webpack：

$ git push heroku master
Counting objects: 3, done.
Delta compression using up to 8 threads.
Compressing objects: 100% (3/3), done.
Writing objects: 100% (3/3), 322 bytes | 0 bytes/s, done.
Total 3 (delta 1), reused 0 (delta 0)
remote: Compressing source files... done.
remote: Building source:
remote:
remote: -----> Python app detected
remote: -----> Installing requirements with pip
remote:
remote: -----> Discovering process types
remote:        Procfile declares types -> web
remote:
remote: -----> Compressing...
remote:        Done: 33.5M
remote: -----> Launching...
remote:        Released v13
remote:        https://mytestapp.herokuapp.com/ deployed to Heroku
remote:
remote: Verifying deploy... done.
To https://git.heroku.com/mytestapp.git
   1fdf467..33852e6  master -> master

Answer 1

好的，我找到了这个问题的解决方案。

它被称为“多个构建包”，并在此处进行了描述：https : //devcenter.heroku.com/articles/using-multiple-buildpacks-for-an-app

所以，这个想法是如果你需要更多的“编译器”，你需要手动添加它们。就我而言，我已经识别了 Python，但没有识别 Node.js。所以，首先我运行这个命令：

heroku buildpacks:add --index 1 heroku/nodejs

然后，当我跑步时

heroku buildpacks

我看见：

  1. heroku/nodejs
  2. heroku/python

然后更改了 package.json：

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

并推到heroku。