我无法在Heroku中运行我的ReactJS应用程序

时间:2017-06-28 17:22:14

标签: javascript node.js reactjs heroku

当我运行npm start时它会起作用,但是在heroku中我无法正常工作,

2017-06-28T17:18:54.167693+00:00 app[web.1]: npm ERR! code ELIFECYCLE
2017-06-28T17:18:54.167918+00:00 app[web.1]: npm ERR! errno ENOENT
2017-06-28T17:18:54.168018+00:00 app[web.1]: npm ERR! syscall spawn
2017-06-28T17:18:54.168132+00:00 app[web.1]: npm ERR! juego-cartas-reactjs@0.1.0 start: `react-scripts start`
2017-06-28T17:18:54.168203+00:00 app[web.1]: npm ERR! spawn ENOENT
2017-06-28T17:18:54.168300+00:00 app[web.1]: npm ERR! 
2017-06-28T17:18:54.168387+00:00 app[web.1]: npm ERR! Failed at the juego-cartas-reactjs@0.1.0 start script.
2017-06-28T17:18:54.169487+00:00 app[web.1]: 
2017-06-28T17:18:54.168480+00:00 app[web.1]: npm ERR! This is probably not a problem with npm. There is likely additional logging output above.
2017-06-28T17:18:54.169649+00:00 app[web.1]: npm ERR! A complete log of this run can be found in:
2017-06-28T17:18:54.169703+00:00 app[web.1]: npm ERR!     /app/.npm/_logs/2017-06-28T17_18_54_163Z-debug.log

我的package.json,我在网上看到,这可能是问题

<!-- language: lang-js -->

    {
      "name": "juego-cartas-reactjs",
      "version": "0.1.0",
      "main":"src/index.js",
      "dependencies": {
        "font-awesome": "^4.7.0",
        "lodash.shuffle": "^4.2.0",
        "react": "^15.6.1",
        "react-dom": "^15.6.1",
        "react-flipcard": "^0.2.1"
      },
      "devDependencies": {
        "react-scripts": "1.0.7"
      },

      "scripts": {
        "start": "react-scripts start",
        "build": "react-scripts build",
        "test": "react-scripts test --env=jsdom",
        "eject": "react-scripts eject"
      }
    }

我不知道还能做什么,如果有人知道这件事,请帮助

2 个答案:

答案 0 :(得分:3)

本地开发

npm start 。你不应该在Heroku上使用它。

将创建React应用程序项目部署到Heroku follow Heroku's official guide to it

cd my-app
git init
heroku create -b https://github.com/mars/create-react-app-buildpack.git
git add .
git commit -m "react-create-app on Heroku"
git push heroku master
heroku open

本文链接自您创建的应用随附的Deployment section of the User Guide。我建议在那里搜索可能的答案。

答案 1 :(得分:2)

我已经在heroku上成功上传了一个create-react-app项目,但我没有使用create-react-app buildpack。这是我的设置:

<强>的package.json

//.. rest of package.json

"dependencies": {
  "express": "^4.14.0",
  //.. rest of dependencies 
},

// need to define engines for heroku
"engines": {
  "node": "6.9.1",
  "npm": "3.10.8"
},
"scripts": {
  "start": "node server.js #Production only!",
  "postinstall": "npm run build",
  "dev": "react-scripts start",
  "build": "react-scripts build",
  "test": "react-scripts test --env=jsdom",
  "eject": "react-scripts eject"
},

然后在项目的根目录中,我创建了一个server.js,这只是一个非常基本的快速应用程序。请注意,它使用构建文件夹,而不是 src 文件夹。

const express = require('express');
const path = require('path');

const app = express();
const port = process.env.PORT || 3000;

app.use(express.static(path.resolve(__dirname, 'build')));

app.get('*', (req, res) => {
  res.sendFile(path.resolve(__dirname, 'build', 'index.html'));
});

app.listen(port, () => {
  console.info(`Server listening on port ${port}`);
});