Cannot find module '@babel/plugin-transform-flow-strip-types' Dockerized app

Viewed 49

I started a new project (CRUD React express mysql), which use webpack+babel+gulp. When i build&run the project local works fine, but when I run it in docker I get a 500 error with `Error: Cannot find module '@babel/plugin-transform-flow-strip-types'

Any clue of what could be ?

The error:

Error: Cannot find module '@babel/plugin-transform-flow-strip-types'
Require stack:
- /root/server/node_modules/@babel/core/lib/config/files/plugins.js
- /root/server/node_modules/@babel/core/lib/config/files/index.js
- /root/server/node_modules/@babel/core/lib/index.js
- /root/server/node_modules/@babel/register/lib/worker/babel-core.js
- /root/server/node_modules/@babel/register/lib/worker/handle-message.js
- /root/server/node_modules/@babel/register/lib/worker-client.js
- /root/server/node_modules/@babel/register/lib/node.js
- /root/server/node_modules/@babel/register/lib/nodeWrapper.js
- /root/server/node_modules/@babel/register/lib/index.js
- /root/server/node_modules/express-react-views/index.js
- /root/server/server.js
    at Function.Module._resolveFilename (internal/modules/cjs/loader.js:902:15)
    at resolve (internal/modules/cjs/helpers.js:107:19)
    at tryRequireResolve (/root/server/node_modules/@babel/core/lib/config/files/plugins.js:157:9)
    at resolveStandardizedNameForRequire (/root/server/node_modules/@babel/core/lib/config/files/plugins.js:195:19)
    at sync (/root/server/node_modules/@babel/core/lib/config/files/plugins.js:224:12)
    at sync (/root/server/node_modules/gensync/index.js:182:19)
    at /root/server/node_modules/gensync/index.js:210:24
    at Generator.next (<anonymous>)
    at resolvePlugin (/root/server/node_modules/@babel/core/lib/config/files/plugins.js:83:17)
    at resolvePlugin.next (<anonymous>)

.babelrc

{
    "presets": [
      "@babel/preset-env",
      "@babel/preset-react"
    ]
  }

package.json

{
  "name": "biografoimaginario",
  "version": "1.0.0",
  "description": "",
  "main": "server.js",
  "scripts": {
    "start": "node server.bundle.js",
    "build": "webpack",
    "dev": "nodemon ./server.js"
  },
  "author": "lucianomdangelo@gmail.com",
  "license": "ISC",
  "dependencies": {
    "bcryptjs": "^2.4.3",
    "body-parser": "^1.20.0",
    "compression": "^1.7.4",
    "cookie-parser": "^1.4.6",
    "cors": "^2.8.5",
    "dotenv": "^16.0.1",
    "ejs": "^3.1.8",
    "express": "^4.18.1",
    "express-react-views": "^0.11.0",
    "express-session": "^1.17.3",
    "jsonwebtoken": "^8.5.1",
    "mysql": "^2.18.1",
    "react": "^18.2.0",
    "react-dom": "^18.2.0"
  },
  "devDependencies": {
    "@babel/core": "^7.18.9",
    "@babel/preset-env": "^7.18.9",
    "@babel/preset-react": "^7.18.6",
    "babel-loader": "^8.2.5",
    "del": "^7.0.0",
    "fancy-log": "^2.0.0",
    "gulp": "^4.0.2",
    "gulp-zip": "^5.1.0",
    "nodemon": "^2.0.19",
    "webpack": "^5.74.0",
    "webpack-cli": "^4.10.0",
    "webpack-node-externals": "^3.0.0",
    "webpack-stream": "^7.0.0"
  }
}

webpack.config.js

const path = require('path');
const nodeExternals = require('webpack-node-externals');

module.exports = {
  entry: './server.js',
  mode: 'production',
  target: 'node',
  externals: [nodeExternals()],
  output: {
    path: path.resolve(__dirname, '.'),
    filename: 'server.bundle.js'
  },
  resolve: { extensions: ['.js', '.jsx'] },
  module: {
    rules: [
      {
        test: /\.(js|jsx)$/,
        exclude: /node_modules/,
        use: 'babel-loader'
      }
    ]
  }
};

gulpfile.js

const { src, dest, series, parallel } = require('gulp');
const del = require('del');
const fs   = require('fs');
const zip = require('gulp-zip');
const log = require('fancy-log');
const webpack_stream = require('webpack-stream');
const webpack_config = require('./webpack.config.js');
var exec = require('child_process').exec;

const paths = {
  prod_build: '../prod-build',
  server_file_name: 'server.bundle.js',
  react_src: '../client/build/**/*',
  react_dist: '../prod-build/client/build',
  zipped_file_name: 'biografoImaginario.zip'
};

function clean()  {
  log('removing the old files in the directory')
  return del('../prod-build/**', {force:true});
}

function createProdBuildFolder() {

  const dir = paths.prod_build;
  log(`Creating the folder if not exist  ${dir}`)
  if(!fs.existsSync(dir)) {
    fs.mkdirSync(dir);
    log('  folder created:', dir);
  }

  return Promise.resolve('the value is ignored');
}

function buildReactCodeTask(cb) {
  log('building React code into the directory')
  return exec('cd ../client && npm run build', function (err, stdout, stderr) {
    log(stdout);
    log(stderr);
    cb(err);
  })
}

function copyReactCodeTask() {
  log('copying React code into the directory')
  return src(`${paths.react_src}`)
        .pipe(dest(`${paths.react_dist}`));
}

function copyNodeJSCodeTask() {
  log('building and copying server code into the directory')
  return webpack_stream(webpack_config)
        .pipe(dest(`${paths.prod_build}`))
}

function zippingTask() {
  log('zipping the code ')
  return src(`${paths.prod_build}/**`)
      .pipe(zip(`${paths.zipped_file_name}`))
      .pipe(dest(`${paths.prod_build}`))
}

exports.default = series(
  clean,
  createProdBuildFolder,
  buildReactCodeTask,
  parallel(copyReactCodeTask, copyNodeJSCodeTask),
  zippingTask
);

Dockerfile

# FROM node:14 AS ui-build
# WORKDIR /usr/src/app
# COPY client/ ./client/
# RUN cd client && npm install && npm run build

FROM node:14 AS server-build
WORKDIR /root/
# COPY --from=ui-build /usr/src/app/client/build ./client/build
COPY server/package*.json ./server/
RUN cd server && npm install
COPY server/server.js ./server/
COPY server/config.js ./server/
COPY server/src/ ./server/src/
COPY server/routes/ ./server/routes/
COPY server/views/ ./server/views/
COPY .babelrc ./server/

EXPOSE 80

CMD ["node", "./server/server.js"]

and I build the docker image like:

docker build -t app-image .
docker run -d -p  3080:3080 --name app-container app-image
0 Answers
Related