1
votes

TypeError: (0, _schemaUtils.default) n'est pas une fonction

J'ai une application React simple créée avec create-react-app qui fonctionne bien sur localhost. J'essaye maintenant d'ancrer l'application. Voici mon package.json:

docker run --publish 3000:3000 yeet

Et voici mon Dockerfile:

docker build --tag yeet .

Je construis l'image avec:

# Specify base image
FROM node:12.19.0-alpine3.10

# Specify app location in host
WORKDIR /app

# Copy the dependency list
COPY package.json ./

# Install app dependencies
RUN npm install

# Copy app code to host
COPY . .

# Open specified port
EXPOSE 3000:3000

# Start the app
CMD ["npm", "run", "production"]

Ensuite, j'exécute l'image en tant que conteneur avec:

{
  "name": "yeet",
  "version": "0.1.0",
  "engines": {
    "node": "12.x"
  },
  "scripts": {
    "client": "react-scripts start",
    "build": "react-scripts build",
    "test": "react-scripts test",
    "eject": "react-scripts eject",
    "start": "node server.js",
    "production": "npm run build && npm run start"
  },
  "private": true,
  "dependencies": {
    "@testing-library/jest-dom": "^5.11.4",
    "@testing-library/react": "^11.1.0",
    "@testing-library/user-event": "^12.1.10",
    "axios": "^0.21.0",
    "body-parser": "^1.19.0",
    "cors": "^2.8.5",
    "express": "^4.17.1",
    "express-session": "^1.17.1",
    "mongoose": "^5.10.13",
    "mysql": "^2.18.1",
    "react": "^17.0.1",
    "react-dom": "^17.0.1",
    "react-scripts": "4.0.0",
    "web-vitals": "^0.2.4"
  },
  "devDependencies": {
    "babel-core": "*",
    "babel-loader": "*",
    "babel-preset-es2015": "*",
    "babel-preset-react": "*",
    "babel-preset-stage-0": "*"
  },
  "babel": {
    "presets": [
      "@babel/env",
      "@babel/react",
      "babel-preset-stage-0"
    ],
    "env": {
      "start": {
        "presets": [
          "@babel/env",
          "@babel/react",
          "babel-preset-stage-0"
        ]
      }
    }
  }
}

Cela jette:

$ docker run --publish 3000: 3000 yeet

yeet@0.1.0 production / application npm run build && npm run start
yeet@0.1.0 build / app react-scripts build
/app/node_modules/eslint-webpack-plugin/dist/options.js:62 (0, _schemaUtils.default) (_ options.default, options, {^
TypeError: (0, _schemaUtils.default) n'est pas une fonction dans getOptions (/app/node_modules/eslint-webpack-plugin/dist/options.js:62:28) au nouveau ESLintWebpackPlugin (/ app / node_modules / eslint-webpack- plugin / dist / index.js: 30: 44) à module.exports (/app/node_modules/react-scripts/config/webpack.config.js:749:7) à Object. (/app/node_modules/react-scripts/scripts/build.js:67:16) à Module._compile (interne / modules / cjs / loader.js: 1015: 30) à Object.Module._extensions..js (interne /modules/cjs/loader.js:1035:10) à Module.load (interne / modules / cjs / loader.js: 879: 32) à Function.Module._load (interne / modules / cjs / loader.js: 724 : 14) à Function.executeUserEntryPoint [as runMain] (internal / modules / run_main.js: 60: 12) à internal / main / run_main_module.js: 17: 47 npm ERR! code ELIFECYCLE npm ERR! errno 1 npm ERR! yeet@0.1.0 build: react react-scripts build npm ERR! Statut de sortie 1 npm ERR! npm ERR! Échec du script de construction yeet@0.1.0. npm ERR! Ce n'est probablement pas un problème avec npm. Il y a probablement une sortie de journalisation supplémentaire ci-dessus.
npm ERR! Un journal complet de cette exécution peut être trouvé dans: npm ERR!
/root/.npm/_logs/2020-11-07T12_47_03_927Z-debug.log npm ERR! code ELIFECYCLE npm ERR! errno 1 npm ERR! yeet@0.1.0 production: npm run build && npm run start npm ERR! Statut de sortie 1 npm ERR! npm ERR! Échec du script de production yeet@0.1.0. npm ERR! Ce n'est probablement pas un problème avec npm. Il y a probablement une sortie de journalisation supplémentaire ci-dessus.
npm ERR! Un journal complet de cette exécution peut être trouvé dans: npm ERR!
/root/.npm/_logs/2020-11-07T12_47_03_923Z-debug.log

Quelqu'un voit-il ce que je fais mal? Tous les pointeurs seraient super utiles!

docker reactjs node.js create-react-app babeljs

4 commentaires

Woof, je puis éjecté enlevé le ESLintPlugin plug - in de webpack.config.js qui ont résolu cette erreur.

J'ai un problème similaire. Je pense que c'est lié à la nouvelle version de react-scripts

Qu'est-ce que vous utilisez pour le style? (CSS, SASS, etc.)

J'utilisais juste du CSS barebones

4 Réponses :

0
votes

Ce qui l'a résolu pour moi était

Rétrogradation de la dépendance "styled-components" et
suppression de la dépendance "redux-devtools-extension" ainsi que
Suppression des fichiers encaissés Docker $ docker builder prune -a

2 commentaires

OP n'utilise pas de composants stylisés ou d'extensions redux-devtools

Je pense que l'étape 3 est suffisante. Pas besoin de 1 et 2.

0
votes

Il existe donc deux façons de résoudre ce problème:

Rétrogradation de React 17 et react-scripts 4.0

C'est ce que j'ai fait puisque je ne voulais pas être éjecté de l'ARC (pour des raisons évidentes). Le problème est dû au fait que la bibliothèque de styles que j'utilise ne fonctionne pas bien avec la façon mise à jour dont l'ARC gère Eslint.

Cela pourrait être d'autres problèmes mais cela semble provenir de react-scripts 4.0

Ceci est mentionné dans le changelog pour react-scripts 4.0

Éjection de l'ARC

Comme mentionné dans les commentaires de @duhaime. Vous pouvez résoudre ce problème directement tout en utilisant React 17 et react-scripts 4.0 en éjectant puis en supprimant ESLintPlugin ou en mettant à jour le chargeur pour résoudre les problèmes avec la bibliothèque que vous utilisez.

Je recommanderais personnellement le premier car je suis sûr que le problème sera résolu le plus tôt possible. Mais les deux options vous y mèneront.

0 commentaires

1
votes

J'ai eu le même problème. Je ne suis pas sûr des autres solutions avec la suppression ou la rétrogradation des bibliothèques si cela fonctionne localement.

Pour résoudre ici, j'ai couru

docker-compose.exe -f .\docker-compose.yml up --build

pour être sûr que mon docker est propre avant de commencer la construction.

En cas d' yarn.lock vous pouvez essayer de supprimer yarn.lock ou package-lock.json .

Si cela peut aider les autres, mes fichiers sont

.dockerignore

server {  
  listen 80;
  server_name frontend;
  location / {
    root /usr/share/nginx/html;
    index index.html;
    try_files $uri /index.html;
  }
}

Dockerfile.dev

version: "3.8"
services:
  print:
    stdin_open: true
    build:
      context: .
      dockerfile: Dockerfile.prod
    ports:
      - "80:80"

docker-compose.dev.yml

FROM node:alpine as build

WORKDIR /app

COPY package.json /app

RUN yarn install

COPY . /app

RUN yarn run build

FROM nginx:stable-alpine
COPY ./nginx/nginx.conf /etc/nginx/conf.d/default.conf
COPY --from=build /app/build /usr/share/nginx/html

Dockerfile.prod

version: "3.8"
services:
  print:
    stdin_open: true
    build:
      context: .
      dockerfile: Dockerfile.dev
    ports:
      - "3000:3000"
    volumes:
      - ".:/app"
      - "/app/node_modules"

docker-compose.prod.yml

FROM node:alpine

WORKDIR /app

COPY package.json /app

RUN yarn install

COPY . .

CMD ["yarn", "start"]

nginx.conf

.git
.gitignore
node_modules
build

Courir

docker container prune
docker image prune

3 commentaires

Cela m'a beaucoup aidé! Je voudrais juste demander, dans votre docker-compose.prod.yml , est-il censé être dockerfile: Dockerfile , ou dockerfile: Dockerfile.prod ? Enfin, je voudrais juste souligner (parce que je suis nouveau dans Docker, et il m'a fallu un certain temps pour le comprendre, cela peut donc aider quelqu'un d'autre), que pour construire Dockerfile.dev, vous devez lancez docker build -f Dockerfile.dev -t devimage . puis vous devez exécuter docker-compose -f docker-compose.dev.yml up

C'était une erreur lors de la copie de mes fichiers source. J'ai édité le message.

Cool. Je reçois toujours une erreur cependant, je vais essayer de la comprendre sans rétrograder, comme suggéré ailleurs ici

0
votes

J'ai eu un problème similaire.

Essayez de remplacer les commandes npm par yarn dans votre Dockerfile - cela a résolu mon problème.

Donc, votre Dockerfile devrait ressembler à ceci:

# Specify base image
FROM node:12.19.0-alpine3.10

# Specify app location in host
WORKDIR /app

# Copy the dependency list
COPY package.json ./

# Install app dependencies
RUN yarn install

# Copy app code to host
COPY . .

# Open specified port
EXPOSE 3000:3000

# Start the app
CMD ["yarn", "run", "start", "production"]

3 commentaires

C'est une solution de contournement chanceuse pour résoudre un "problème de cache" où il s'exécute également avec npm.

Je suis d'accord, exactement, comme vous l'avez écrit.

npm cache clean --force