TypeError: (0, _schemaUtils.default) non è una funzione

Question

Ho una semplice app React creata con create-react-appche funziona bene su localhost. Ora sto cercando di Dockerify l'app. Ecco il mio package.json:

{
  "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"
        ]
      }
    }
  }
}

Ed ecco il mio Dockerfile:

# 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"]

Costruisco l'immagine con:

docker build --tag yeet .

Quindi eseguo l'immagine come contenitore con:

docker run --publish 3000:3000 yeet

Questo genera:

$ docker run --publish 3000: 3000 yeet

[email protected] produzione / app npm run build && npm run start

[email protected] build / app react-scripts build

/app/node_modules/eslint-webpack-plugin/dist/options.js:62 (0, _schemaUtils.default) (_ options.default, opzioni, {^

TypeError: (0, _schemaUtils.default) non è una funzione in getOptions (/app/node_modules/eslint-webpack-plugin/dist/options.js:62:28) nel nuovo ESLintWebpackPlugin (/ app / node_modules / eslint-webpack- plugin / dist / index.js: 30: 44) su module.exports (/app/node_modules/react-scripts/config/webpack.config.js:749:7) su Object. (/app/node_modules/react-scripts/scripts/build.js:67:16) su Module._compile (internal / modules / cjs / loader.js: 1015: 30) su Object.Module._extensions..js (interno /modules/cjs/loader.js:1035:10) su Module.load (internal / modules / cjs / loader.js: 879: 32) su Function.Module._load (internal / modules / cjs / loader.js: 724 : 14) in Function.executeUserEntryPoint [as runMain] (internal / modules / run_main.js: 60: 12) in internal / main / run_main_module.js: 17: 47 npm ERR! codice ELIFECYCLE npm ERR! errno 1 npm ERR! [email protected] build:react-scripts buildnpm ERR! Stato di uscita 1 npm ERR! npm ERR! Errore nello script di compilazione [email protected]. npm ERR! Questo probabilmente non è un problema con npm. È probabile che sia presente un output di registrazione aggiuntivo sopra.

npm ERR! Un registro completo di questa corsa può essere trovato in: npm ERR!
/root/.npm/_logs/2020-11-07T12_47_03_927Z-debug.log npm ERR! codice ELIFECYCLE npm ERR! errno 1 npm ERR! [email protected] produzione: npm run build && npm run startnpm ERR! Stato di uscita 1 npm ERR! npm ERR! Errore nello script di produzione [email protected]. npm ERR! Questo probabilmente non è un problema con npm. È probabile che sia presente un output di registrazione aggiuntivo sopra.

npm ERR! Un registro completo di questa corsa può essere trovato in: npm ERR!
/root/.npm/_logs/2020-11-07T12_47_03_923Z-debug.log

Qualcuno vede cosa sto sbagliando? Qualsiasi suggerimento sarebbe super utile!

Answer 1

Ho avuto lo stesso problema. Non sono sicuro di altre soluzioni con la rimozione o il downgrade delle librerie se viene eseguito localmente.

Per risolvere qui, sono corso

docker container prune
docker image prune

per essere sicuro che il mio docker sia pulito prima di iniziare a costruire.

Se non ha successo puoi provare a eliminare yarn.locko package-lock.json.

Se può aiutare gli altri, i miei file lo sono

.dockerignore

.git
.gitignore
node_modules
build

Dockerfile.dev

FROM node:alpine

WORKDIR /app

COPY package.json /app

RUN yarn install

COPY . .

CMD ["yarn", "start"]

docker-compose.dev.yml

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

Dockerfile.prod

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

docker-compose.prod.yml

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

nginx.conf

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

Correre

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

Answer 2

Quello che mi ha risolto è stato

1. Downgrade della dipendenza "styled-components" e
2. rimuovendo la dipendenza "redux-devtools-extension" così come
3. Eliminazione dei file incassati Docker $ docker builder prune -a

Answer 3

Quindi ci sono due modi per risolvere questo problema:

Downgrade da React 17 e react-scripts 4.0

Questo è quello che ho fatto poiché non volevo espellere dal CRA (per ovvie ragioni). Il problema è dovuto al fatto che la libreria di stili che sto utilizzando non funziona bene con il modo aggiornato in cui CRA gestisce Eslint.

Potrebbero essere altri problemi ma sembra provenire da react-scripts 4.0

Questo è menzionato nel changelog per react-scripts 4.0

Espulsione dal CRA

Come accennato nei commenti di @duhaime. Puoi risolvere questo problema direttamente mentre usi ancora React 17 e react-scripts 4.0 espellendo e quindi rimuovendo ESLintPlugin o aggiornando il caricatore per risolvere i problemi con qualsiasi libreria tu stia utilizzando.

Io personalmente consiglierei il primo perché sono sicuro che il problema verrà risolto il prima possibile. Ma entrambe le opzioni ti porteranno lì.

Answer 4

Ho avuto un problema simile.

Prova a sostituire i comandi npm con filato nel tuo Dockerfile: ha risolto il mio problema.

Quindi il tuo Dockerfile dovrebbe apparire così:

# 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"]