dockerを用いた仮想環境上で、nodeのモジュールがインストールできない

前提・実現したいこと

dockerで仮想環境を構築し、
react+redux+typescriptでアプリを製作しようとしております。
しかし、axiosやmaterial-uiなど、
使いたいモジュールがインポート出来ていなくて困っております。
仮想環境上でモジュールをインストール、インポートする方法をご教授願いたく存じます。

発生している問題・エラーメッセージ

App.tsx上で、
import axios from 'axios';を入力すると、
下記のようなメッセージが出て、
コンパイル出来ない状態でございます。

Cannot find module 'axios' or its corresponding type declarations.ts(2307)

該当のソースコード

ディレクトリ
.
├── docker
│   └── react
│         └── Dockerfile
└── docker-compose.yml

Dockerfile
1FROM node:12.18.4
2WORKDIR /usr/src/app
3RUN npx create-react-app . --template redux-typescript
4RUN npm install axios
5RUN npm install react-router-dom @types/react-router-dom
6RUN npm install react-icons @types/react-icons
7RUN npm install react-modal @types/react-modal
8RUN npm install @material-ui/core @material-ui/icons

docker
1version: "3"
2services:
3  react_frontend:
4    build:
5      context: .
6      dockerfile: ./docker/react/Dockerfile
7    container_name: react_container
8    tty: true
9    volumes:
10      - ./react_frontend:/usr/src/app
11    command: sh -c "npm start"
12    ports:
13      - 3000:3000
14

カレントディレクトリにて下記コマンドを実行

docker-compose run --rm react_frontend sh -c 'npx create-react-app . --template redux-typescript'

実行後のディレクトリ

.
├── docker
│   └── react
│         └── Dockerfile
├── react_frontend
│         ├── node_modules
│         ├── public
│         ├── src
│         └── ...
└── docker-compose.yml

気になっていること

この場合ですと、ホスト側のディレクトリにて、
npm installなどを使って直接モジュールをインストールしても問題ないのしょうか。
それとも、仮想環境構築の時点でミスがあるのでしょうか。

初歩的な質問で恐縮でございますが、何卒よろしくお願い申し上げます。

補足情報

Docker version 20.10.5
node v12.18.4

hoshi-takanori

2021/03/19 14:57

Dockerfile の中で create-react-app したものとは別に docker-compose run で create-react-app する意味って何でしょうか？

masa_iss_mago

2021/03/20 06:06

ご連絡、誠にありがとうございます。 docker-compose run で、ホスト側のreact用ディレクトリを作成するものだと思っておりましたが、完全に無駄なコマンドだったのですね…。ホスト側でreactアプリを作成、それを仮想環境にコピーする形で解決することができました。ご指摘ありがとうございました。