reactjs - Docker构建无法解析绝对路径

Question

我有一个react应用程序，其中我使用绝对导入而不是相对导入(https://medium.com/@ktruong008/absolute-imports-with-create-react-app-4338fbca7e3d)。一切都可以在本地计算机上正常工作，但是当我尝试在docker上构建时，它会失败。

我有一个包含NODE_PATH='./'的.env文件，并且对create-react-app进行了配置，以使其Webpack配置将自动选择'.env'文件并读取NODE_PATH环境变量，然后可以将其用于绝对导入，因此像src/components/NavBar这样的东西可以解决。

但是，当我尝试在docker上构建时，它无法解决，但会引发此错误。

Cannot find module: 'src/components/NavBar'. Make sure this package is installed.
You can install this package by running: yarn add src/components/NavBar.

任何指针将不胜感激。

今天是我第一次与Docker合作，所以我是菜鸟。

附加信息:

我使用一个Dockerfile和一个docker-compose.yml文件。

我使用react-app-rewired( https://github.com/timarney/react-app-rewired)，它基本上可以帮助您覆盖create-react-app webpack配置而不弹出。

Dockerfile

FROM node:10.15.1

ENV NODE_ENV production

RUN mkdir /usr/invoicing

COPY . /usr/invoicing

WORKDIR /usr/invoicing

RUN npm install

RUN npm run build

docker-compose.yml

version: '3.5'
services:
  web:
    container_name: invoice-frontend
    build:
      context: .
      dockerfile: Dockerfile
    command: npm start
    ports:
      - '3000:3000'
    networks:
      - frontend
    environment:
      - NODE_ENV=production
networks:
  frontend:
    driver: 'bridge'

Answer 1

我找到了问题和解决方案:

显然，我将文件夹命名为navBar，当我将其重命名为NavBar时，Git并未检测到文件夹名称的更改，也没有对此进行任何处理。因此，在我的本地计算机(是Mac)上，它显示了NavBar，但是在使用git commits的Gitlab上，它仍然显示为navBar，并且cos Docker在Linux上运行，并且Linux区分大小写，构建失败。

这也解释了为什么该构建可在我的本地计算机上使用。 Mac的文件系统hfplus不区分大小写，因此没有问题。

解决重命名问题；我使用了git mv命令。有一个警告。如果您想在不区分大小写的文件系统(例如Mac)上将foldername重命名为folderName(即更改大小写)，则会收到一条错误消息:fatal: renaming ‘foldername’ failed: Invalid argument.
为了成功地重命名文件夹，请使用此命令。git mv foldername tempname && git mv tempname folderName。这将过程分为两个步骤。首先将foldername重命名为tempname，并将tempname重命名为folderName。

希望这可以帮助某人😊