Warning: file_get_contents(/data/phpspider/zhask/data//catemap/3/reactjs/26.json): failed to open stream: No such file or directory in /data/phpspider/zhask/libs/function.php on line 167

Warning: Invalid argument supplied for foreach() in /data/phpspider/zhask/libs/tag.function.php on line 1116

Notice: Undefined index: in /data/phpspider/zhask/libs/function.php on line 180

Warning: array_chunk() expects parameter 1 to be array, null given in /data/phpspider/zhask/libs/function.php on line 181

Warning: file_get_contents(/data/phpspider/zhask/data//catemap/1/typescript/9.json): failed to open stream: No such file or directory in /data/phpspider/zhask/libs/function.php on line 167

Warning: Invalid argument supplied for foreach() in /data/phpspider/zhask/libs/tag.function.php on line 1116

Notice: Undefined index: in /data/phpspider/zhask/libs/function.php on line 180

Warning: array_chunk() expects parameter 1 to be array, null given in /data/phpspider/zhask/libs/function.php on line 181
Reactjs Docker没有';找不到语义用户界面_Reactjs_Typescript_Docker_Docker Compose_Semantic Ui - Fatal编程技术网

Reactjs Docker没有';找不到语义用户界面

Reactjs Docker没有';找不到语义用户界面,reactjs,typescript,docker,docker-compose,semantic-ui,Reactjs,Typescript,Docker,Docker Compose,Semantic Ui,我是docker的新手,我想在docker内部构建一个react应用程序(带有typescript),我需要使用语义ui react。 我按照这里的说明按应用程序构建: 我使用npm I-g semantic ui react添加了语义ui,这是我的App.tsx: import React from 'react'; import './App.css'; import {Button} from "semantic-ui-react"; class App extends React.Pu

我是docker的新手,我想在docker内部构建一个react应用程序(带有typescript),我需要使用语义ui react。 我按照这里的说明按应用程序构建:

我使用npm I-g semantic ui react添加了语义ui,这是我的App.tsx:

import React from 'react';
import './App.css';
import {Button} from "semantic-ui-react";

class App extends React.PureComponent {

    render() {
        return (<div>
            This is text
            <Button>
                ok
            </Button>
        </div>)
    }
}

export default App;
我试着用npm建立docker的形象,然后我改成了Thread,认为它会解决问题。 到目前为止我使用过的构建命令:

docker compose build—无缓存和&docker compose up-d—强制重新创建

docker compose build--无缓存

docker compose up-d--强制重新创建--构建

我的Dockerfile

# base image
FROM node:12.2.0-alpine

# set working directory
WORKDIR /app

# add `/app/node_modules/.bin` to $PATH
ENV PATH /app/node_modules/.bin:$PATH

# install and cache app dependencies
COPY package.json /app/package.json
RUN cat package.json
RUN yarn install

# start app
CMD ["yarn", "start"]
my docker-compose.yml:

version: '2.2'

volumes:
  frontend:

services:

  frontend:
    container_name: container
    build:
      context: .
      dockerfile: Dockerfile
    volumes:
      - '.:/app'
      - '/app/node_modules'
    ports:
      - '3001:3000'
    environment:
      - NODE_ENV=development
我正在使用Ubuntu 18.04

在我的Dockerfile中,我添加了
cat package.json
,以查看是否添加了语义用户界面,以及它是否正确

Step 5/7 : RUN cat package.json
 ---> Running in b6bbcda3221b
{
  "name": "frontend",
  "version": "0.1.0",
  "private": true,
  "dependencies": {
    "@testing-library/jest-dom": "^4.2.4",
    "@testing-library/react": "^9.3.2",
    "@testing-library/user-event": "^7.1.2",
    "@types/jest": "^24.0.0",
    "@types/node": "^12.0.0",
    "@types/react": "^16.9.0",
    "@types/react-dom": "^16.9.0",
    "react": "^16.13.1",
    "react-dom": "^16.13.1",
    "react-scripts": "3.4.0",
    "semantic-ui-react": "^0.88.2",
    "typescript": "~3.7.2"
  },
  "scripts": {
    "start": "react-scripts start",
    "build": "react-scripts build",
    "test": "react-scripts test",
    "eject": "react-scripts eject"
  },
  "eslintConfig": {
    "extends": "react-app"
  },
  "browserslist": {
    "production": [
      ">0.2%",
      "not dead",
      "not op_mini all"
    ],
    "development": [
      "last 1 chrome version",
      "last 1 firefox version",
      "last 1 safari version"
    ]
  }
}
我已经从终端执行了
warn start
,当我在浏览器中打开它时,没有错误,项目工作正常


为什么docker找不到语义ui模块?

显然这是

弗雷德里克斯的答案也适用于这里。我搬走了

-'/app/node_modules'
来自docker-compose.yml中的卷,现在它可以识别所有模块

Step 5/7 : RUN cat package.json
 ---> Running in b6bbcda3221b
{
  "name": "frontend",
  "version": "0.1.0",
  "private": true,
  "dependencies": {
    "@testing-library/jest-dom": "^4.2.4",
    "@testing-library/react": "^9.3.2",
    "@testing-library/user-event": "^7.1.2",
    "@types/jest": "^24.0.0",
    "@types/node": "^12.0.0",
    "@types/react": "^16.9.0",
    "@types/react-dom": "^16.9.0",
    "react": "^16.13.1",
    "react-dom": "^16.13.1",
    "react-scripts": "3.4.0",
    "semantic-ui-react": "^0.88.2",
    "typescript": "~3.7.2"
  },
  "scripts": {
    "start": "react-scripts start",
    "build": "react-scripts build",
    "test": "react-scripts test",
    "eject": "react-scripts eject"
  },
  "eslintConfig": {
    "extends": "react-app"
  },
  "browserslist": {
    "production": [
      ">0.2%",
      "not dead",
      "not op_mini all"
    ],
    "development": [
      "last 1 chrome version",
      "last 1 firefox version",
      "last 1 safari version"
    ]
  }
}