ヘロクのWepbackで構築されたプロダクションリアクションアプリをホスト

Question

私が英雄にプッシュするたびに、単に「見つからない」と表示されます。私はそれがwebpackが実行されないためだと仮定していますか？

私は、スクリプトのすべての種類を試してみた：

"scripts": { 
    "clean": "rimraf dist", 
    "build": "npm run clean && NODE_ENV=production && webpack -p --progress", 
    "postinstall": "npm run builds", 
    "serve": "webpack-dev-server" 
} 

と別のものを、単にインストール後なし。

postinstallがインストールされていると、webpackがインストールされていない（devDependenciesの下に保存されている）というエラーが表示されます。 2番目のページでは、Herokuのログに成功したビルドを取得しますが、ページをロードすると「見つからない」と表示されます。

Answer 1

"devDependencies"ではなく、webpack（およびHerokuに必要なその他の依存関係）をpackage.jsonの "dependencies"に入れる必要があります。

Answer 2

これを処理するより良い方法は、あなたのpackage.jsonをきれいに保つことだと思うし、Herokuは物を作るのが難しくなるので、その特定のケースを処理するだけです。

私たちはあなたの package.jsonのスクリプトセクションから

など、クリーンアップ、これらのタスクの負荷のdevの依存関係、ビルドタスクを実行するためにNPMのインストール後のフックを使用し

：

"scripts": { 
    "postinstall": "node ./ops/heroku-build.js" 
} 

そしてheroku-build.js：

'use strict'; 

if ('HEROKU' in process.env || ('DYNO' in process.env && process.env.HOME === '/app')){ 

    const pkg = require('../package.json'); 
    const ChildProcess = require('child_process'); 


    let deps = pkg.devDependencies; 
    let packages = ""; 

    Object.keys(deps).forEach((key) => { 
    packages += `${key}@${deps[key]} `; // note space at end to separate entries 
    }); 

    try { 
    console.time("install"); 
    console.log("starting npm install of dev dependencies"); 
    ChildProcess.execSync(`npm install ${packages}`); 
    console.timeEnd("install"); 

    console.time("build"); 
    console.log("starting npm build"); 
    ChildProcess.execSync(`npm run build:all`); 
    console.timeEnd("build"); 

    console.time("uninstall"); 
    console.log("starting npm uninstall of dev dependencies"); 
    ChildProcess.execSync(`npm uninstall ${packages}`); 
    console.timeEnd("uninstall"); 
    } 
    catch (err) { 
    console.error(err.message); 
    } 
} else { 
    console.log("Not Heroku, skipping postinstall build"); 
} 

このようにAWSや他の場所に展開することに決めた場合、その環境の特質を扱うことができます個別にnt。

Heroku documentation on how to customize the build process。