将带React组件的Ruby on Rails项目部署到Heroku

我正在尝试部署一个Ruby on Rails应用程序，其中一个Node.js前端到Heroku 。我越来越：

在这里输入图像说明

这是我的Procfile：

web:bundle exec thin start -p $PORT

这是我的package.json：

 { "name": "collectize", "version": "1.0.0", "description": "[Heroku link][heroku]", "main": "index.js", "directories": { "doc": "docs", "test": "test" }, "engines": { "node": "4.1.1", "npm": "2.1.x" }, "scripts": { "test": "echo \"Error: no test specified\" && exit 1", "postinstall": "./node_modules/.bin/webpack" "start": "node ./app/assets/javascripts/bundle.js" }, "repository": { "type": "git", "url": "git+https://github.com/winterblack/Collectize.git" "start": "web:bundle exec thin start -p $PORT" }, "keywords": [], "author": "", "license": "ISC", "bugs": { "url": "https://github.com/winterblack/Collectize/issues" }, "homepage": "https://github.com/winterblack/Collectize#readme", "dependencies": { "babel-core": "^6.10.4", "babel-loader": "^6.2.4", "babel-preset-es2015": "^6.9.0", "babel-preset-react": "^6.11.1", "flux": "^2.1.1", "react": "^15.2.1", "react-dom": "^15.2.1", "react-router": "^2.5.2", "webpack": "^1.13.1" }, "devDependencies": {} }

这是我的Heroku日志：

 2016-07-13T05:29:29.266840+00:00 heroku[api]: Release v28 created by wylliamjudd@gmail.com 2016-07-13T05:29:29.266840+00:00 heroku[api]: Deploy 7d61777 by wylliamjudd@gmail.com 2016-07-13T05:29:29.456774+00:00 heroku[slug-compiler]: Slug compilation started 2016-07-13T05:29:29.517376+00:00 heroku[web.1]: Restarting 2016-07-13T05:29:29.518479+00:00 heroku[web.1]: State changed from up to starting 2016-07-13T05:29:32.421302+00:00 heroku[web.1]: Stopping all processes with SIGTERM 2016-07-13T05:29:33.846617+00:00 heroku[web.1]: Process exited with status 143 2016-07-13T05:29:41.586027+00:00 heroku[web.1]: Starting process with command `npm start` 2016-07-13T05:29:43.343250+00:00 app[web.1]: 2016-07-13T05:29:43.343268+00:00 app[web.1]: > collectize@1.0.0 start /app 2016-07-13T05:29:43.343269+00:00 app[web.1]: > node ./app/assets/javascripts/bundle.js 2016-07-13T05:29:43.343269+00:00 app[web.1]: 2016-07-13T05:29:43.513547+00:00 app[web.1]: 2016-07-13T05:29:43.520060+00:00 app[web.1]: at Object.<anonymous> (/app/app/assets/javascripts/bundle.js:88:4) 2016-07-13T05:29:43.520063+00:00 app[web.1]: at Object.<anonymous> (/app/app/assets/javascripts/bundle.js:43:10) 2016-07-13T05:29:43.520063+00:00 app[web.1]: at Module._compile (module.js:456:26) 2016-07-13T05:29:43.532480+00:00 app[web.1]: npm ERR! This is most likely a problem with the collectize package, 2016-07-13T05:29:43.535942+00:00 app[web.1]: 2016-07-13T05:29:44.242442+00:00 heroku[web.1]: Process exited with status 1 2016-07-13T05:29:44.280956+00:00 heroku[web.1]: State changed from starting to crashed 2016-07-13T05:29:44.282455+00:00 heroku[web.1]: State changed from crashed to starting 2016-07-13T05:29:57.352852+00:00 heroku[web.1]: Starting process with command `npm start` 2016-07-13T05:29:59.471893+00:00 app[web.1]: 2016-07-13T05:29:59.471938+00:00 app[web.1]: > collectize@1.0.0 start /app 2016-07-13T05:29:59.471940+00:00 app[web.1]: > node ./app/assets/javascripts/bundle.js 2016-07-13T05:29:59.471943+00:00 app[web.1]: 2016-07-13T05:29:59.650297+00:00 app[web.1]: 2016-07-13T05:29:59.654711+00:00 app[web.1]: /app/app/assets/javascripts/bundle.js:88 2016-07-13T05:29:59.655117+00:00 app[web.1]: $(document).ready(function () { 2016-07-13T05:29:59.659133+00:00 app[web.1]: at Object.<anonymous> (/app/app/assets/javascripts/bundle.js:88:4) 2016-07-13T05:29:59.659135+00:00 app[web.1]: at __webpack_require__ (/app/app/assets/javascripts/bundle.js:20:30) 2016-07-13T05:29:59.659138+00:00 app[web.1]: at Module.load (module.js:356:32) 2016-07-13T05:29:59.659139+00:00 app[web.1]: at Function.Module._load (module.js:312:12) 2016-07-13T05:29:59.659140+00:00 app[web.1]: at Function.Module.runMain (module.js:497:10) 2016-07-13T05:29:59.659141+00:00 app[web.1]: at startup (node.js:119:16) 2016-07-13T05:29:59.672227+00:00 app[web.1]: npm ERR! node v0.10.30 2016-07-13T05:29:59.672464+00:00 app[web.1]: npm ERR! npm v2.1.18 2016-07-13T05:29:59.672884+00:00 app[web.1]: npm ERR! code ELIFECYCLE 2016-07-13T05:29:59.673045+00:00 app[web.1]: npm ERR! collectize@1.0.0 start: `node ./app/assets/javascripts/bundle.js` 2016-07-13T05:29:59.673873+00:00 app[web.1]: npm ERR! This is most likely a problem with the collectize package, 2016-07-13T05:29:59.674006+00:00 app[web.1]: npm ERR! not with npm itself. 2016-07-13T05:29:59.674125+00:00 app[web.1]: npm ERR! Tell the author that this fails on your system: 2016-07-13T05:29:59.674412+00:00 app[web.1]: npm ERR! You can get their info via: 2016-07-13T05:29:59.674578+00:00 app[web.1]: npm ERR! npm owner ls collectize 2016-07-13T05:29:59.674919+00:00 app[web.1]: npm ERR! There is likely additional logging output above. 2016-07-13T05:29:59.677307+00:00 app[web.1]: 2016-07-13T05:30:00.517992+00:00 heroku[web.1]: State changed from starting to crashed 2016-07-13T05:30:00.501781+00:00 heroku[web.1]: Process exited with status 1 2016-07-13T05:30:01.842475+00:00 heroku[router]: at=error code=H10 desc="App crashed" method=GET path="/" host=collectize.herokuapp.com request_id=111967a3-b265-4447-8e7e-da8a723b5b48 fwd="24.176.249.167" dyno= connect= service= status=503 bytes=

在我的本地机器上，我需要运行：

 ~$ bundle install ~$ npm install ~$ webpack ~$ thin start

我必须有Heroku运行node bundle.js为了得到我的React组件？如果是这样，为什么我不能在我的机器上这样做？ Heroku上发生的事情和我本地机器上发生的事情之间的区别是我需要澄清的主要问题。

日志中的这一行似乎很重要：

 /app/app/assets/javascripts/bundle.js:88 $(document).ready(function () {

我几乎从来没有运行一个JavaScript文件与Node.js（除了一些debugging）; 我几乎总是在HTML中的Web应用程序中使用JavaScript。我尝试在本地运行node bundle.js ，并得到ReferenceError: $ is not defined 。我试图将其更改为document.addEventListener("DOMContentLoaded", …但后来我只是得到了相同的错误文件没有定义。

我真的不知道该从哪里去。我不明白为什么Heroku需要运行节点bundle.js，或者它甚至不需要。

我曾尝试删除Procfile，只是把我的启动脚本"bundle exec thin start -p $PORT"放在我的package.json中，实际上我的网站“up”，但没有React组件（所以完全空白）。

我发现用Heroku，你需要包含一个favicon。该应用程序将崩溃，否则。

把它包含在你的<head> ：

 <link href="/images/favicon.png" rel="shortcut icon" type="image/png"/>

相应地调整path，文件名和types。

问题是Heroku设置为服务Rails后端或Node.js同构前端。你不能在同一个应用程序中做两个。

使用两个应用程序 myapp-api.herokuapp.com是Rails和myapp-web.herokuapp.com是React同构的。我个人承载了netlify.com上的React前端，这是一个静态托pipe服务。
在构build过程中使用webpack构build，并从Rails提供静态文件。 webpack-rails看起来很有前景。

删除nodejs构build包，并决定如何为您的前端服务。单独的应用程序，或静态构build。

显然，我所要做的就是删除我的nodejs buildpack并用索引1读取它。当我这样做时，我的网站立即开始工作。然后我从我的package.json删除了启动脚本，网站仍然工作。然后我删除了我的proc文件，网站仍然有效。

所以，唯一的问题是buildpack的顺序，不需要procfile，也不需要启动脚本。

将带React组件的Ruby on Rails项目部署到Heroku

asynchronousIO服务器：精简（Ruby）和Node.js. 有什么区别？