如何将使用Webpack的节点部署到heroku

node.js Webpack

西门小宇宙

2020-03-24

我正在使用webpack。

另外,我不提交所有生成的文件所在的npm_modules文件夹和公用文件夹。在部署和设置服务器(已经在寻找公用文件夹)之后,我不知道如何构建我的应用程序(我有webpack build命令)。

在上传之前提交似乎是个坏主意。也许有一些温柔的决定...有什么想法吗?

派生自:如何将使用Gulp的节点部署到heroku

第3735篇《如何将使用Webpack的节点部署到heroku》来自Winter(https://github.com/aiyld/aiyld.github.io)的站点

3个回答
番长猴子 2020.03.24

postinstall按照@orlando的建议脚本中执行此操作:

"postinstall": "webpack -p --config ./webpack.prod.config.js --progress"

在这种方法中,请确保 heroku config:set NODE_ENV=production heroku config:set NPM_CONFIG_PRODUCTION=true

要么

您可以找到可用的自定义buildpack heroku-buildpack-webpack

这些链接可以帮助您建立理解:

猴子 2020.03.24

在2019年,执行此操作的最简单方法是使用heroku/nodejsbuildpack(如果package.json在存储库的根目录中有则自动选择build并向包json 添加脚本:

"build": "webpack --mode production --config ./webpack.prod.config.js"

Heroku将在部署时自动运行此脚本。值得一提的是,这是运行在本地或CI中测试构建的直观脚本。

Heroku的Node.js开发最佳实践文档中对此进行了描述

npm的生命周期脚本非常适合自动化。Heroku提供了自定义钩子,使您可以在安装依赖项之前或之后运行自定义命令。如果您需要在构建应用程序之前运行某些程序,则可以使用heroku-prebuild脚本。需要使用grunt,gulp,browserify或webpack构建资产吗?build脚本执行。

小宇宙 2020.03.24
"heroku-postbuild": "webpack -p --config ./webpack.prod.config.js --progress"

这样比较好,因为如果使用postinstall,则每次执行npm i构建脚本时都会被解雇

问题类别

JavaScript Ckeditor Python Webpack TypeScript Vue.js React.js ExpressJS KoaJS CSS Node.js HTML Django 单元测试 PHP Asp.net jQuery Bootstrap IOS Android