我正在尝试将我的React应用程序部署到Heroku ...该应用程序在我的本地服务器以及Heroku上成功编译和构建，但应用程序仍显示错误。我还将 https://github.com/mars/create-react-app-buildpack.git 添加到heroku中的buildpack中。
另外，我从我的github帐户自动部署。
我做错了什么？我已经按照相同的问题跟进了多个教程，但它们似乎没有用。
我在构建时收到此错误;另外，我没有使用create-react-app来构建我的反应文件，如果它有所不同，它是从头开始构建的：
这是我的 heroku日志：
2018-02-02T01:59:42.996186+00:00 app[api]: Deploy 4177f4a1 by user km
2018-02-02T01:59:42.996186+00:00 app[api]: Release v15 created by user km
2018-02-02T01:59:30.000000+00:00 app[api]: Build succeeded
2018-02-02T01:59:43.376904+00:00 heroku[web.1]: State changed from crashed to starting
2018-02-02T01:59:45.759417+00:00 heroku[web.1]: Starting process with command `npm start`
2018-02-02T01:59:47.448351+00:00 app[web.1]:
2018-02-02T01:59:47.448375+00:00 app[web.1]: > get_happy@1.0.0 prestart /app
2018-02-02T01:59:47.448377+00:00 app[web.1]: > babel-node tools/startMessage.js
2018-02-02T01:59:47.448379+00:00 app[web.1]:
2018-02-02T01:59:47.453960+00:00 app[web.1]: sh: 1: babel-node: not found
2018-02-02T01:59:47.458812+00:00 app[web.1]: npm ERR! file sh
2018-02-02T01:59:47.459004+00:00 app[web.1]: npm ERR! code ELIFECYCLE
2018-02-02T01:59:47.459150+00:00 app[web.1]: npm ERR! errno ENOENT
2018-02-02T01:59:47.459294+00:00 app[web.1]: npm ERR! syscall spawn
2018-02-02T01:59:47.460345+00:00 app[web.1]: npm ERR! get_happy@1.0.0 prestart: `babel-node tools/startMessage.js`
2018-02-02T01:59:47.460449+00:00 app[web.1]: npm ERR! spawn ENOENT
2018-02-02T01:59:47.460621+00:00 app[web.1]: npm ERR!
2018-02-02T01:59:47.460767+00:00 app[web.1]: npm ERR! Failed at the get_happy@1.0.0 prestart script.
2018-02-02T01:59:47.460915+00:00 app[web.1]: npm ERR! This is probably not a problem with npm. There is likely additional logging output above.
2018-02-02T01:59:47.465102+00:00 app[web.1]:
2018-02-02T01:59:47.465281+00:00 app[web.1]: npm ERR! A complete log of this run can be found in:
2018-02-02T01:59:47.465403+00:00 app[web.1]: npm ERR! /app/.npm/_logs/2018-02-02T01_59_47_462Z-debug.log
2018-02-02T01:59:47.522890+00:00 heroku[web.1]: State changed from starting to crashed
2018-02-02T01:59:47.524985+00:00 heroku[web.1]: State changed from crashed to starting
2018-02-02T01:59:47.512556+00:00 heroku[web.1]: Process exited with status 1
2018-02-02T01:59:48.223138+00:00 heroku[web.1]: Restarting
2018-02-02T01:59:47.918820+00:00 app[api]: Deploy 4177f4a1 by user kristinenicolemartin@gmail.com
2018-02-02T01:59:47.918820+00:00 app[api]: Release v16 created by user kristinenicolemartin@gmail.com
2018-02-02T01:59:35.000000+00:00 app[api]: Build succeeded
2018-02-02T01:59:49.821030+00:00 heroku[web.1]: Starting process with command `npm start`
2018-02-02T01:59:50.411360+00:00 heroku[web.1]: Starting process with command `npm start`
2018-02-02T01:59:51.526967+00:00 heroku[web.1]: Process exited with status 1
2018-02-02T01:59:51.468148+00:00 app[web.1]:
2018-02-02T01:59:51.468180+00:00 app[web.1]: > get_happy@1.0.0 prestart /app
2018-02-02T01:59:51.468182+00:00 app[web.1]: > babel-node tools/startMessage.js
2018-02-02T01:59:51.468183+00:00 app[web.1]:
2018-02-02T01:59:51.474558+00:00 app[web.1]: sh: 1: babel-node: not found
2018-02-02T01:59:51.478509+00:00 app[web.1]: npm ERR! file sh
2018-02-02T01:59:51.478718+00:00 app[web.1]: npm ERR! code ELIFECYCLE
2018-02-02T01:59:51.479015+00:00 app[web.1]: npm ERR! syscall spawn
2018-02-02T01:59:51.478870+00:00 app[web.1]: npm ERR! errno ENOENT
2018-02-02T01:59:51.480022+00:00 app[web.1]: npm ERR! get_happy@1.0.0 prestart: `babel-node tools/startMessage.js`
2018-02-02T01:59:51.480131+00:00 app[web.1]: npm ERR! spawn ENOENT
2018-02-02T01:59:51.480419+00:00 app[web.1]: npm ERR! Failed at the get_happy@1.0.0 prestart script.
2018-02-02T01:59:51.480307+00:00 app[web.1]: npm ERR!
2018-02-02T01:59:51.480524+00:00 app[web.1]: npm ERR! This is probably not a problem with npm. There is likely additional logging output above.
2018-02-02T01:59:51.484184+00:00 app[web.1]:
2018-02-02T01:59:51.484320+00:00 app[web.1]: npm ERR! A complete log of this run can be found in:
2018-02-02T01:59:51.484394+00:00 app[web.1]: npm ERR! /app/.npm/_logs/2018-02-02T01_59_51_481Z-debug.log
2018-02-02T01:59:51.736214+00:00 app[web.1]:
2018-02-02T01:59:51.736235+00:00 app[web.1]: > get_happy@1.0.0 prestart /app
2018-02-02T01:59:51.736236+00:00 app[web.1]: > babel-node tools/startMessage.js
2018-02-02T01:59:51.736238+00:00 app[web.1]:
2018-02-02T01:59:51.741298+00:00 app[web.1]: sh: 1: babel-node: not found
2018-02-02T01:59:51.745176+00:00 app[web.1]: npm ERR! file sh
2018-02-02T01:59:51.745365+00:00 app[web.1]: npm ERR! code ELIFECYCLE
2018-02-02T01:59:51.745513+00:00 app[web.1]: npm ERR! errno ENOENT
2018-02-02T01:59:51.745655+00:00 app[web.1]: npm ERR! syscall spawn
2018-02-02T01:59:51.746647+00:00 app[web.1]: npm ERR! get_happy@1.0.0 prestart: `babel-node tools/startMessage.js`
2018-02-02T01:59:51.746747+00:00 app[web.1]: npm ERR! spawn ENOENT
2018-02-02T01:59:51.746912+00:00 app[web.1]: npm ERR!
2018-02-02T01:59:51.747048+00:00 app[web.1]: npm ERR! Failed at the get_happy@1.0.0 prestart script.
2018-02-02T01:59:51.747139+00:00 app[web.1]: npm ERR! This is probably not a problem with npm. There is likely additional logging output above.
2018-02-02T01:59:51.753972+00:00 app[web.1]:
2018-02-02T01:59:51.754106+00:00 app[web.1]: npm ERR! A complete log of this run can be found in:
2018-02-02T01:59:51.754183+00:00 app[web.1]: npm ERR! /app/.npm/_logs/2018-02-02T01_59_51_748Z-debug.log
2018-02-02T01:59:51.806311+00:00 heroku[web.1]: State changed from starting to crashed
2018-02-02T01:59:51.793636+00:00 heroku[web.1]: Process exited with status 1
2018-02-02T01:59:53.465155+00:00 heroku[router]: at=error code=H10 desc="App crashed" method=GET path="/" host=roadtripadventuremap.herokuapp.com request_id=963138bc-c512-494c-ab33-536e80bd852e fwd="169.234.121.183" dyno= connect= service= status=503 bytes= protocol=https
2018-02-02T01:59:54.762050+00:00 heroku[router]: at=error code=H10 desc="App crashed" method=GET path="/favicon.ico" host=roadtripadventuremap.herokuapp.com request_id=65a22a16-7957-4b58-9e09-f643cf1d66bf fwd="169.234.121.183" dyno= connect= service= status=503 bytes= protocol=https
2018-02-02T02:00:00.979814+00:00 heroku[router]: at=error code=H10 desc="App crashed" method=GET path="/" host=roadtripadventuremap.herokuapp.com request_id=bf3d2c9c-cfc8-412e-a70b-90c567c31c47 fwd="169.234.121.183" dyno= connect= service= status=503 bytes= protocol=https
2018-02-02T02:00:01.499596+00:00 heroku[router]: at=error code=H10 desc="App crashed" method=GET path="/favicon.ico" host=roadtripadventuremap.herokuapp.com request_id=a6474fcc-e0d3-4759-aa5c-9eb66b2ea99f fwd="169.234.121.183" dyno= connect= service= status=503 bytes= protocol=https
2018-02-02T02:04:47.266697+00:00 heroku[router]: at=error code=H10 desc="App crashed" method=GET path="/" host=roadtripadventuremap.herokuapp.com request_id=ba293b4e-d453-4efb-af0c-083988b21341 fwd="169.234.121.183" dyno= connect= service= status=503 bytes= protocol=https
2018-02-02T02:04:48.908422+00:00 heroku[router]: at=error code=H10 desc="App crashed" method=GET path="/favicon.ico" host=roadtripadventuremap.herokuapp.com request_id=9e802bae-6a14-489b-a320-eb3f2b466044 fwd="169.234.121.183" dyno= connect= service= status=503 bytes= protocol=https
2018-02-02T02:05:16.000000+00:00 app[api]: Build started by user kristinenicolemartin@gmail.com
2018-02-02T02:05:29.978451+00:00 app[api]: Release v17 created by user kristinenicolemartin@gmail.com
2018-02-02T02:05:29.978451+00:00 app[api]: Deploy 4177f4a1 by user kristinenicolemartin@gmail.com
2018-02-02T02:05:16.000000+00:00 app[api]: Build succeeded
2018-02-02T02:05:30.530834+00:00 heroku[web.1]: State changed from crashed to starting
2018-02-02T02:05:33.002249+00:00 heroku[web.1]: Starting process with command `npm start`
2018-02-02T02:05:34.774529+00:00 heroku[web.1]: Process exited with status 1
2018-02-02T02:05:34.700006+00:00 app[web.1]:
2018-02-02T02:05:34.700025+00:00 app[web.1]: > get_happy@1.0.0 prestart /app
2018-02-02T02:05:34.705878+00:00 app[web.1]: sh: 1: babel-node: not found
2018-02-02T02:05:34.700028+00:00 app[web.1]:
2018-02-02T02:05:34.700027+00:00 app[web.1]: > babel-node tools/startMessage.js
2018-02-02T02:05:34.710132+00:00 app[web.1]: npm ERR! file sh
2018-02-02T02:05:34.710316+00:00 app[web.1]: npm ERR! code ELIFECYCLE
2018-02-02T02:05:34.710461+00:00 app[web.1]: npm ERR! errno ENOENT
2018-02-02T02:05:34.710596+00:00 app[web.1]: npm ERR! syscall spawn
2018-02-02T02:05:34.711653+00:00 app[web.1]: npm ERR! get_happy@1.0.0 prestart: `babel-node tools/startMessage.js`
2018-02-02T02:05:34.711755+00:00 app[web.1]: npm ERR! spawn ENOENT
2018-02-02T02:05:34.712019+00:00 app[web.1]: npm ERR! Failed at the get_happy@1.0.0 prestart script.
2018-02-02T02:05:34.711916+00:00 app[web.1]: npm ERR!
2018-02-02T02:05:34.717594+00:00 app[web.1]:
2018-02-02T02:05:34.712115+00:00 app[web.1]: npm ERR! This is probably not a problem with npm. There is likely additional logging output above.
2018-02-02T02:05:34.717719+00:00 app[web.1]: npm ERR! A complete log of this run can be found in:
2018-02-02T02:05:34.717779+00:00 app[web.1]: npm ERR! /app/.npm/_logs/2018-02-02T02_05_34_713Z-debug.log
2018-02-02T02:05:34.786663+00:00 heroku[web.1]: State changed from starting to crashed
2018-02-02T02:06:16.229103+00:00 heroku[router]: at=error code=H10 desc="App crashed" method=GET path="/" host=roadtripadventuremap.herokuapp.com request_id=6217683a-b0a1-46d6-b718-f569f8ea2932 fwd="169.234.121.183" dyno= connect= service= status=503 bytes= protocol=https
2018-02-02T02:06:17.893550+00:00 heroku[router]: at=error code=H10 desc="App crashed" method=GET path="/favicon.ico" host=roadtripadventuremap.herokuapp.com request_id=015e4a3e-111e-4bfe-bd01-19d2140a7957 fwd="169.234.121.183" dyno= connect= service= status=503 bytes= protocol=https
以下是我的文件细分：
static.json文件：
{
"root": "dist/",
"routes": {
"/**": "index.html"
}
}
的package.json：
{
"name": "get_happy",
"version": "1.0.0",
"description": "React sign up flow for Happy Money",
"scripts": {
"prestart": "babel-node tools/startMessage.js",
"start": "npm-run-all --parallel open:src lint:watch test:watch",
"open:src": "babel-node tools/srcServer.js",
"lint": "node_modules/.bin/esw webpack.config.* src tools",
"lint:watch": "npm run lint -- --watch",
"test": "mocha --reporter spec tools/testSetup.js \"src/**/*.test.js\"",
"test:watch": "npm run test -- --watch",
"clean-dist": "npm run remove-dist && mkdir dist",
"remove-dist": "node_modules/.bin/rimraf ./dist",
"build:html": "babel-node tools/buildHtml.js",
"prebuild": "npm-run-all clean-dist test lint build:html",
"build": "babel-node tools/build.js",
"postbuild": "babel-node tools/distServer.js"
},
"author": "Kristine Martin",
"license": "MIT",
"dependencies": {
"babel-polyfill": "6.8.0",
"bootstrap": "3.3.6",
"jquery": "2.2.3",
"react": "15.0.2",
"react-addons-css-transition-group": "^15.6.2",
"react-dom": "15.0.2",
"react-redux": "4.4.5",
"react-router": "2.4.0",
"react-router-redux": "4.0.4",
"react-transition-group": "^1.2.1",
"redux": "3.5.2",
"redux-thunk": "2.0.1",
"toastr": "2.1.2"
},
"devDependencies": {
"babel-cli": "6.8.0",
"babel-core": "6.8.0",
"babel-loader": "6.2.4",
"babel-plugin-react-display-name": "2.0.0",
"babel-preset-es2015": "6.6.0",
"babel-preset-react": "6.5.0",
"babel-preset-react-hmre": "1.1.1",
"babel-register": "6.8.0",
"cheerio": "0.22.0",
"colors": "1.1.2",
"compression": "1.6.1",
"cross-env": "1.0.7",
"css-loader": "0.23.1",
"enzyme": "2.2.0",
"eslint": "2.9.0",
"eslint-plugin-import": "1.6.1",
"eslint-plugin-react": "5.0.1",
"eslint-watch": "2.1.11",
"eventsource-polyfill": "0.9.6",
"expect": "1.19.0",
"express": "4.13.4",
"extract-text-webpack-plugin": "1.0.1",
"file-loader": "0.8.5",
"jsdom": "8.5.0",
"mocha": "2.4.5",
"nock": "8.0.0",
"npm-run-all": "1.8.0",
"open": "0.0.5",
"react-addons-test-utils": "15.0.2",
"redux-immutable-state-invariant": "1.2.3",
"redux-mock-store": "1.0.2",
"rimraf": "2.5.2",
"style-loader": "0.13.1",
"url-loader": "0.5.7",
"webpack": "1.13.0",
"webpack-dev-middleware": "1.6.1",
"webpack-hot-middleware": "2.10.0"
},
"repository": {
"type": "git",
"url": "h####"
}
}
我的webpack.config.prod.js
import webpack from 'webpack';
import path from 'path';
import ExtractTextPlugin from 'extract-text-webpack-plugin';
const GLOBALS = {
'process.env.NODE_ENV': JSON.stringify('production')
};
export default {
debug: true,
devtool: 'source-map',
noInfo: false,
entry: './src/index',
target: 'web',
output: {
path: __dirname + '/dist', //Note: Physical files are only output by the production build task `npm run build`.
publicPath: '/',
filename: 'bundle.js'
},
devServer: {
contentBase: './dist'
},
plugins: [
new webpack.optimize.OccurrenceOrderPlugin(),
new webpack.DefinePlugin(GLOBALS),
new ExtractTextPlugin('styles.css'),
new webpack.optimize.DedupePlugin(),
new webpack.optimize.UglifyJsPlugin()
],
module: {
loaders: [
{test: /\.js$/, include: path.join(__dirname, 'src'), loaders: ['babel']},
{test: /(\.css)$/, loader: ExtractTextPlugin.extract("css?sourceMap")},
{test: /\.eot(\?v=\d+\.\d+\.\d+)?$/, loader: 'file'},
{test: /\.(woff|woff2)$/, loader: 'url?prefix=font/&limit=5000'},
{test: /\.ttf(\?v=\d+\.\d+\.\d+)?$/, loader: 'url?limit=10000&mimetype=application/octet-stream'},
{test: /\.svg(\?v=\d+\.\d+\.\d+)?$/, loader: 'url?limit=10000&mimetype=image/svg+xml'}
]
}
};
这是构建日志：
-----> Node.js app detected
-----> Creating runtime environment
NPM_CONFIG_LOGLEVEL=error
NPM_CONFIG_PRODUCTION=true
NODE_VERBOSE=false
NODE_ENV=production
NODE_MODULES_CACHE=true
-----> Installing binaries
engines.node (package.json): unspecified
engines.npm (package.json): unspecified (use default)
Resolving node version 8.x...
Downloading and installing node 8.9.4...
Using default npm version: 5.6.0
-----> Restoring cache
Loading 2 from cacheDirectories (default):
- node_modules
- bower_components (not cached - skipping)
-----> Building dependencies
Installing node modules (package.json + package-lock)
up to date in 2.689s
-----> Caching build
Clearing previous node cache
Saving 2 cacheDirectories (default):
- node_modules
- bower_components (nothing to cache)
-----> Build succeeded!
-----> Discovering process types
Procfile declares types -> (none)
Default types for buildpack -> web
-----> Compressing...
Done: 25.4M
-----> Launching...
Released v13
https://roadtripadventuremap.herokuapp.com/ deployed to Heroku
答案 0 :(得分：0)
首先，您正在＆＃34; npm预启动中运行babel-node＆＃34; （这可能不是你真正应该做的事情），但看起来你的devDependencies中有babel-cli（package to install to obtain babel-node），默认情况下Heroku不会安装它。
请参阅this answer以了解如何修复构建。 基本上，您需要更改package.json，以便与构建应用程序相关的所有内容（例如各种＆＃34; build＆＃34; package.json脚本中的步骤，以及babel-node的任何调用）都是在Heroku slug编译时执行。另请参阅precompiling with babel-node以获取有关如何将任何babel节点用法移动到生产环境（例如Heroku）中的预编译步骤的说明。
您还需要确保Heroku安装您需要的任何构建依赖项，这意味着要么将babel等从devDependencies移动到依赖项，要么将config var NPM_CONFIG_PRODUCTION设置为false。