tsconfig.json
を作成する:package.json
を作成する:app.js
ファイルにモジュールをバンドルするためのwebpack.config.js
を作成する:src/templates/index.html
ファイルです。生成されたファイルはpublic
フォルダに配置され、Webサーバーから提供されます:src/app/app.tsx
は以下の通りです:最新のパッケージを入手するにはnpm install [email protected] [email protected] [email protected] @types/[email protected] @types/[email protected] [email protected] [email protected] [email protected] [email protected] [email protected] [email protected] --save-exact
を実行してください。
npm start
を実行してライブ開発を行いますsrc/app/app.tsx
(またはsrc/app/app.tsx
に使われるts/tsxファイル)を編集すれば、サーバーがLive Reloadしますsrc/templates/index.html
を編集すれば、サーバーがLive Reloadしますnpm run build
を実行して本番用のアセットをビルドしますpublic
フォルダ(ビルドされたアセットが配置される)をサーブしますnpm i -g create-react-app
というコマンドでローカルPCにグローバルにインストールできます。npx create-react-app my-app --template typescript
というコマンドを実行します。my-app
の部分には、プロジェクトに利用するフォルダ名を指定します。これで、最初からTypeScriptを利用可能なプロジェクトを簡単に作成できます。tsconfig.json
が作成されます。これを必要に応じて修正し、TypeScriptのコンパイラの動作を、好みに合わせて調整することができます。npm run build
または yarn build
のコマンドで、本番環境用のビルドを実行できます。これで、Reactチームによって本番環境に最適化されたバンドルファイルを出力できます。