2017-08-20 29 views
0

マイディレクトリ:Heroku:エラー:ENOENT:そのようなファイルやディレクトリはありません。 '/app/build/index.html'を開きますか?

enter image description here

私はHerokuのでプロジェクトを反応させることdepolyしてみてください。

ただし、エラーメッセージが表示されます。

それは「エラー:ENOENT:そのようなファイルやディレクトリはありません、開いて 'です/app/build/index.html'

私のNode.jsサーバーコード

サーバー/ app.js:

import express from 'express'; 
import morgan from 'morgan'; 
import path from 'path'; 
import loader from './loader'; 

const app = express(); 

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

app.use('/', loader); 

// exporting module 
export default app; 

サーバー/ loader.js:

... 
export default (req, res) => { 
const filePath = path.resolve(__dirname, '../build', 'index.html'); 

fs.readFile(filePath, 'utf8', (err, htmlData)=>{ 
    if (err) { 
    console.error('read error', err) 
    return res.status(404).end() 
    } 
    const context = {} 
    const markup = renderToString(
    <StaticRouter location={req.url} context={context}> 
    <App/> 
    </StaticRouter> 
) 

    if (context.url) { 
    redirect(301, context.url) 
    } else { 
    const Rendered = htmlData.replace('{{SSR}}', markup) 
    res.send(Rendered) 
    } 
}) 

は、私は問題はないと思うが、私が接続しようとすると、私が取得します'見つかりません'ページ。

問題を解決するにはどうすればよいですか?

+編集:

マイpackage.json:

... 
"engines": { 
    "node": "6.11.1" 
}, 
"dependencies": { 
    "axios": "^0.16.2", 
"express": "^4.15.4", 
"morgan": "^1.8.2", 
"react": "^15.6.1", 
"react-dom": "^15.6.1", 
"react-ga": "^2.2.0", 
"react-router": "^4.1.2", 
"react-router-dom": "^4.1.2", 
"react-scripts": "1.0.10", 
"semantic-ui-css": "^2.2.12", 
"semantic-ui-react": "^0.71.4" 
}, 
"scripts": { 
"start": "NODE_ENV=development ./node_modules/.bin/babel-node server", 
"start:server": "NODE_ENV=development babel-node server", 
"build": "react-scripts build", 
"test": "mocha test", 
"eject": "react-scripts eject" 
}, 
"devDependencies": { 
"babel-cli": "^6.26.0", 
"babel-core": "^6.26.0", 
"babel-plugin-transform-require-ignore": "^0.1.1", 
"babel-preset-env": "^1.6.0", 
"babel-preset-es2015": "^6.24.1", 
"babel-preset-react": "^6.24.1", 
"babel-preset-react-app": "^3.0.2", 
"babel-preset-stage-0": "^6.24.1", 
"chai": "^4.1.1", 
"mocha": "^3.5.0", 
"mz": "^2.6.0", 
"supertest": "^3.0.0", 
"supertest-as-promised": "^4.0.2" 
} 
} 
+0

ため、通常 かなり複雑だと、あなたのpackage.jsonを投稿して、アプリ –

+0

を展開するために使用するコマンド@TharakaWijebandara申し訳ありませんが、私が編集してくださいPackage.jsonを追加します。 私は 'git push heroku master'に命令します。それでおしまい。 –

+0

と私は "heroku config:set NPM_CONFIG_PRODUCTION = false"とコマンドします。 –

答えて

1

circleciやtravisciなどのherokuにビルドして押し込むために、CIソリューションを使用できます。これは私が行うことですので、私は間違いなく新鮮なビルドを得ることができます。

buildフォルダをgithubにプッシュする方法も問題ありません。私は気づいていない何らかの理由で誰かが同意しないだろうと確信していますが、うまくいきます。

0

はそれを考え出しました。
私の.gitignoreファイルに 'build'があります。

もしそうなら、ビルドディレクトリもgithubにプッシュされます。それ以外の方法はありますか?

-1

確かにビルドフォルダを生成してプッシュすることができますが、ローカルにビルドするにはこれが最良の方法だとは思いません。 デプロイ(PLZ https://devcenter.heroku.com/articles/nodejs-supportを読む)とき、それは サーバー上のビルドファイルを生成しますので、あなたが

  1. 使用NPMスクリプトこのような「Herokuの-ポストビルド」として、 ステップを構築ハンドルにできました。
  2. テストを処理し、部品を構築するために使用するCIは、それが大規模なプロジェクト
関連する問題