[英]React - Module not found: Can't resolve component
I'm trying to deploy a React website using Docker, but when I'm building the docker image I get:我正在尝试使用 Docker 部署 React 网站,但是当我构建 docker 图像时,我得到:
Module not found: Error: Can't resolve './components/Home' in '/app/src'
I'm developping the application in a Windows environment but my docker container is hosted on a Linux machine (in Microsoft Azure).我在 Windows 环境中开发应用程序,但我的 docker 容器托管在 Linux 机器上(在 Microsoft Azure 中)。
My files are organised like this:我的文件是这样组织的:
├ src/
| ├── index.js
| ├── App.js
| └── components/
| └─── Home.js
├ public/
├ Dockerfile
├ package.json
└ yarn.lock
My dockerfile:我的 dockerfile:
FROM node:18-alpine
WORKDIR /app
COPY package.json /app/package.json
COPY yarn.lock /app/yarn.lock
COPY src /app/src
COPY public /app/public
RUN yarn
RUN yarn run build
RUN yarn global add serve
EXPOSE 3000
CMD ["serve", "-s", "build"]
My App.js
looks like:我的
App.js
看起来像:
import "./App.css";
import React, { lazy } from "react";
import { BrowserRouter as Router, Routes, Route, Navigate } from "react-router-dom";
const Home = lazy(() => import("./components/Home"));
const App = () => {
return (
<Router>
<Routes>
<Route exact path="/home" element={<Home />} />
<Route path="*" element={<Navigate replace to="/home" />} />
</Routes>
</Router>
);
};
export default App;
My Home.js
looks like:我的
Home.js
看起来像:
import React from "react";
const Home = () => {
return (
<h1>Home Page</h1>
);
};
export default Home;
If I run the website localy only using the following terminal commands:如果我仅使用以下终端命令在本地运行网站:
yarn && yarn start
or或者
yarn && yarn run build
serve -s build
I don't run into the error.我没有遇到错误。
If I move my Home.js
file oustide the components/
folder (resulting in it being in the same folder as my App.js
I don't have the error message and the application runs, that would be an ok solution if my website only used the Home
component but I have multiple files with multiple components and I don't want to just dump them in my src/
folder.如果我将我的
Home.js
文件移出components/
文件夹(导致它与我的App.js
在同一个文件夹中,我没有错误消息并且应用程序运行,如果我的网站只有使用了Home
组件,但我有多个包含多个组件的文件,我不想只将它们转储到我的src/
文件夹中。
I already saw a lot of posts with similar errors but the solution is often to just check for caps errors in file path, and I have done that a million times already.我已经看到很多有类似错误的帖子,但解决方案通常是只检查文件路径中的大写错误,我已经做了一百万次了。
Any help would be appreciated at this point...此时任何帮助将不胜感激......
Changing your file structure for both systems would be a viable option as docker needs a lot of clarification on file paths to create an image.更改两个系统的文件结构将是一个可行的选择,因为 docker 需要对文件路径进行大量说明才能创建图像。 here's somewhat the same problem in Linux for a user
对于用户来说,Linux 中存在一些相同的问题
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.