LoginSignup
10
5

More than 3 years have passed since last update.

npmパッケージのserveで立てたローカルサーバーでReact Appを確認する方法

Last updated at Posted at 2019-05-20

概要

npmパッケージのserveを使ってローカルに立ち上げたサーバーでReact Appを確認する方法です.
主に,ビルドしたファイル群をリモートのサーバーにデプロイする前にローカル環境で確認したい人向けです.

環境

Node.js >= 6
npm >= 5.2

React開発環境のセットアップ

npx create-react-app my-app
cd my-app
npm start

ブラウザで http://localhost:3000/ にアクセスしてこんな感じの画面が出てこれば無事にセットアップ完了です.
ctr+cで開発用サーバーを終了してください.

スクリーンショット 2019-05-20 15.06.48.png

Reactのビルド

npm run build

ホスティングするファイル群がbuildディレククトリに生成されます.

serveのインストール

npm install serve -g

ローカルサーバー立ち上げ

serve -s ./build

デフォルトのポートが5000なので, http://localhost:5000 にアクセスすればビルドしたReact Appが確認できます.

10
5
0

Register as a new user and use Qiita more conveniently

  1. You get articles that match your needs
  2. You can efficiently read back useful information
  3. You can use dark theme
What you can do with signing up
10
5