質問: `https://github.com/davezuko/react-redux-starter-kit` で公開されているスターターキットでReactに入門し,ある程度のものができたので それをサーバにデプロイしたいのですが,その方法がわかりません. READMEには「静的デプロイが簡単である」 と書いていたので`yarn build` してindex.htmlにアクセスしてみましたが, どうもうまく表示されません. index.htmlに書いているjsのルートを書き換えても表示されず, なにが原因かわからないので,1からデプロイ方法を教えていただけますでしょうか? よろしくおねがいします. ----追記---- `yarn build`すると`dist`ディレクトリができますが, その中にあるindex.htmlを開いて,実装したページを表示する方法を 教えていただければ,現状十分です.
回答: 参考ですが、自分の環境では以下のようにするとできました、 ``` $ git clone https://github.com/davezuko/react-redux-starter-kit.git $ cd react-redux-starter-kit $ npm install $ npm run build ``` distの中のファイルを一式別のフォルダに移動し、app.jsを作成 ``` var app = require('connect')(); app.use(require('serve-static')(__dirname)) app.listen(3000); ``` 以下を実行 ``` $ npm install connect serve-static $ node app.js ``` にアクセス !キャプチャ ※ 「node」 「簡易サーバー」 で検索して最初に出てきたページを参考 http://qiita.com/natsuki_summer/items/df93b9fa102f792732e8 ### コメントへの追記です。 webpackの使用方法の例ですが、例えば、requireといった、「Node.jsを使用したJavaScriptの実行環境では動く」が、「ブラウザではエラーになる」書き方を、 webpackで1つのjsファイルにすることで、ブラウザで読み込めるようになります。 ``` // index.js var test = require('./test.js'); console.log(test); ``` ``` // test.js var test = 'test出力'; module.exports = test; ``` ※普通requireをブラウザで読み込むとエラーになる。 !ブラウザで読み込むとエラー ↓ webpackを使用すると解決してくれる !イメージ説明 webpackを使用することで、index.jsとtest.jsを合わせたbundle.jsを作成してくれて、 それをhtmlで読み込むことでrequireの書き方でもブラウザで動作できます。 なので、webpackを使用することでnode以外でも動かせるようになるという感じだと私は思ってます。