堆棧內存溢出
  簡體   English   中英

將React部署到Heroku-應用程序錯誤，但構建沒有錯誤

[英]Deploying React to Heroku - Application Error but no error on build

 原文  2018-02-01 02:08:20  9   1    javascript/ reactjs/ express/ heroku/ react-redux

問題描述

我正在嘗試將React應用程序部署到Heroku ...該應用程序可以在本地服務器以及Heroku上成功編譯並構建，但是該應用程序仍顯示錯誤。 我也將https://github.com/mars/create-react-app-buildpack.git添加到了我在heroku中的buildpacks中。

另外，我已經從我的github帳戶進行了自動部署。

我究竟做錯了什么？ 我已關注同一問題的多個教程，但它們似乎不起作用。

我在構建時收到此錯誤； 另外，我沒有使用create-react-app來構建我的react文件，如果有區別，它是從頭開始構建的：

這是我的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

1 個解決方案

解決方案1
 0  2018-02-02 08:32:00

首先，您正在“ npm prestart”中運行babel-node（這可能不是您真正應該做的），但是您似乎擁有babel-cli（這是安裝以獲得babel-node的軟件包） ）在您的devDependencies中，默認情況下Heroku不會安裝。

查看此答案以了解如何修復您的構建。 基本上，您需要更改package.json，以便與構建應用程序相關的所有操作（例如package.json腳本中的各個“構建”步驟以及babel-node的任何調用）都在Heroku slug編譯中執行時間。 另請參閱使用babel-node進行預編譯以獲取有關如何將任何babel-node用法移至生產環境（例如Heroku）中的預編譯步驟的說明。

您還需要確保Heroku安裝所需的任何構建依賴項，這意味着將babel等從devDependencies移至依賴項，或者將config var NPM_CONFIG_PRODUCTION設置為false。

暫無
暫無

聲明:本站的技術帖子網頁，遵循CC BY-SA 4.0協議，如果您需要轉載，請注明本站網址或者原文地址。任何問題請咨詢:yoyou2525@163.com.

相關問題 在heroku中部署html應用程序時生成錯誤 在 Heroku 上部署 create-react-app 的應用程序錯誤 應用程序錯誤-在Heroku上部署Node JS 使用Heroku進行節點部署時出現“應用程序錯誤” heroku 應用構建成功，但遇到“應用程序錯誤” 將 Django-React 應用程序部署到 Heroku 時出錯 將帶有Parcel的React App部署到Heroku提供中無法解決依賴關系錯誤 自定義 React 應用程序 - 部署到 Heroku 時獲取 API 錯誤 Heroku＆React部署成功，但出現應用程序錯誤 將Alexa Skill部署到heroku時出錯
相關標簽
 
粵ICP備18138465號  © 2020-2024 STACKOOM.COM