应用程序部署到Heroku,但这是表示未检测到Node.js应用程序"/>
我正在尝试将应用程序部署到Heroku,但这是表示未检测到Node.js应用程序
我知道这是因为根目录中没有package.json文件。我在Client文件夹(使用vue-cli创建)和Server文件夹(nodejs / express)中有一个文件夹。我有webpack设置
我的问题是,我是否必须将其中之一移到项目的根目录中?如果是,哪一个?还是有一种方法可以将它们组合在一起?我是否只需要在根目录中运行一个npm init?
我完全感到困惑。
回答如下:Heroku指南
目录结构
您可以使用任何一个打包文件,具体取决于您希望如何构建项目。重要的是Heroku根目录包含带有启动节点服务器的package.json
脚本的start
文件。 (Heroku的示例使用服务器的软件包。这意味着将您的Vue应用程序放置在server
文件夹中,但是您不必这样做。)
我更喜欢将Node服务器文件夹放在Vue项目根目录内。然后,我将项目根目录用作Heroku根目录,并使用Vue的package.json启动应用程序。我假设您也使用此结构,并且您的服务器已准备好静态服务dist
目录。
Vue CLI root
> dist
> node_modules
> public
v server
package.json
> src
package.json <-- Heroku will use this one for the `start` script
package.json
接下来,编辑Vue应用程序的package.json
scripts
部分以添加start
脚本:
"scripts": {
"serve": "vue-cli-service serve",
"build": "vue-cli-service build",
"lint": "vue-cli-service lint",
"start": "node server/index.js"
}
[您可以看到新的start
脚本告诉Heroku下移到server
目录并运行index.js
,它是Node应用程序。
准备
- 将
dist
,server
和package.json
上载到Heroku的根目录。 - 除非您上载了
npm install
的package.json
文件夹,否则您需要使用Heroku CLI来servers
服务器的node_modules
。 - 您不需要需在根目录中使用
npm install
Vue的package.json
,因为Heroku仅在start
脚本中需要它。
回顾
- 将服务器文件夹放在Vue项目根目录中。
- 编辑Vue项目的
package.json
以包括start
脚本。 - 将
dist
,server
和package.json
上传到Heroku。 - 在Heroku上,在节点服务器目录中运行
npm install
。
注意:我想您可以根据需要上传src
而不是dist
,因为Heroku现在应该会自动运行build
。我没有测试过,因为我使用下面的GitHub集成。
GitHub集成
您只需稍作修改即可使用Heroku的GitHub集成(这是我喜欢此目录结构的主要原因)。再次编辑Vue应用程序的package.json
,并在新的start
脚本之前或之后添加以下脚本:
"heroku-prebuild": "cd server/ && npm install"
现在,只要您提交到GitHub,就可以按一个按钮来部署新应用。这就是我的操作方式,永远不要使用Heroku CLI。
更多推荐
我正在尝试将应用程序部署到Heroku,但这是表示未检测到Node.js应用程序
发布评论