DigitalOcean

Report this

What is the reason for this report?
Question

Getting error in React Js application - App Platform

Posted on September 26, 2024
Websites
Deployment
React
Cloud Website Hosting
Developer Tools
Application Development
Website Development
Samiuddin Mohammed

By Samiuddin Mohammed

Hi, I am new to DigitalOcean I created an reactjs app connecting to flask app on the same App Platform, when deployed and access the reatJS site

Uncaught Error: Module build failed (from ./node_modules/babel-loader/lib/index.js):
Error: [BABEL] /workspace/client/src/index.js: Cannot find module '@babel/plugin-proposal-private-property-in-object'
Require stack:
- /workspace/client/node_modules/babel-preset-react-app/create.js
- /workspace/client/node_modules/babel-preset-react-app/index.js
- /workspace/client/node_modules/@babel/core/lib/config/files/module-types.js
- /workspace/client/node_modules/@babel/core/lib/config/files/configuration.js
- /workspace/client/node_modules/@babel/core/lib/config/files/index.js
- /workspace/client/node_modules/@babel/core/lib/index.js
- /workspace/client/node_modules/@rollup/plugin-babel/dist/index.js
- /workspace/client/node_modules/workbox-build/build/lib/bundle.js
- /workspace/client/node_modules/workbox-webpack-plugin/build/generate-sw.js
- /workspace/client/node_modules/workbox-webpack-plugin/build/index.js
- /workspace/client/node_modules/react-scripts/config/webpack.config.js
- /workspace/client/node_modules/react-scripts/scripts/start.js (While processing: "/workspace/client/node_modules/babel-preset-react-app/index.js")
    at Module._resolveFilename (node:internal/modules/cjs/loader:1145:15)
    at Module._load (node:internal/modules/cjs/loader:986:27)
    at Module.require (node:internal/modules/cjs/loader:1233:19)
    at require (node:internal/modules/helpers:179:18)
    at module.exports (/workspace/client/node_modules/babel-preset-react-app/create.js:168:9)
    at module.exports (/workspace/client/node_modules/babel-preset-react-app/index.js:19:10)
    at async (/workspace/client/node_modules/@babel/core/lib/gensync-utils/async.js:35:33)
    at async (/workspace/client/node_modules/gensync/index.js:186:15)
    at /workspace/client/node_modules/gensync/index.js:216:13
    at Generator.next (<anonymous>)
    at /workspace/client/node_modules/@babel/core/lib/config/full.js:180:21
    at Generator.next (<anonymous>)
    at Function.<anonymous> (/workspace/client/node_modules/@babel/core/lib/gensync-utils/async.js:21:3)
    at Generator.next (<anonymous>)
    at step (/workspace/client/node_modules/gensync/index.js:269:25)
    at evaluateAsync (/workspace/client/node_modules/gensync/index.js:291:5)
    at Function.errback (/workspace/client/node_modules/gensync/index.js:113:7)
    at errback (/workspace/client/node_modules/@babel/core/lib/gensync-utils/async.js:65:18)
    at async (/workspace/client/node_modules/gensync/index.js:188:17)
    at onFirstPause (/workspace/client/node_modules/gensync/index.js:216:13)
    at Generator.next (<anonymous>)
    at cachedFunction (/workspace/client/node_modules/@babel/core/lib/config/caching.js:52:46)
    at cachedFunction.next (<anonymous>)
    at loadPresetDescriptor (/workspace/client/node_modules/@babel/core/lib/config/full.js:292:43)
    at loadPresetDescriptor.next (<anonymous>)
    at recursePresetDescriptors (/workspace/client/node_modules/@babel/core/lib/config/full.js:77:31)
    at recursePresetDescriptors.next (<anonymous>)
    at /workspace/client/node_modules/@babel/core/lib/config/full.js:156:21
    at Generator.next (<anonymous>)
    at loadFullConfig (/workspace/client/node_modules/@babel/core/lib/config/full.js:113:5)
    at loadFullConfig.next (<anonymous>)
    at transform (/workspace/client/node_modules/@babel/core/lib/transform.js:20:44)
    at transform.next (<anonymous>)
    at step (/workspace/client/node_modules/gensync/index.js:269:25)
    at evaluateAsync (/workspace/client/node_modules/gensync/index.js:291:5)
    at errback (/workspace/client/node_modules/gensync/index.js:113:7)
    at stopHiding - secret - don't use this - v1 (/workspace/client/node_modules/@babel/core/lib/errors/rewrite-stack-trace.js:47:12)
    at transform (/workspace/client/node_modules/@babel/core/lib/transform.js:39:72)
    at node:internal/util:431:7
    at new Promise (<anonymous>)
    at transform (node:internal/util:417:12)
    at /workspace/client/node_modules/babel-loader/lib/transform.js:15:22
    at Generator.next (<anonymous>)
    at asyncGeneratorStep (/workspace/client/node_modules/babel-loader/lib/transform.js:3:103)
    at _next (/workspace/client/node_modules/babel-loader/lib/transform.js:4:194)
    at /workspace/client/node_modules/babel-loader/lib/transform.js:4:364
    at new Promise (<anonymous>)
    at /workspace/client/node_modules/babel-loader/lib/transform.js:4:97
    at /workspace/client/node_modules/babel-loader/lib/transform.js:48:17
    at /workspace/client/node_modules/babel-loader/lib/cache.js:130:26
    at Module._resolveFilename (node:internal/modules/cjs/loader:1145:15)
    at Module._load (node:internal/modules/cjs/loader:986:27)
    at Module.require (node:internal/modules/cjs/loader:1233:19)
    at require (node:internal/modules/helpers:179:18)
    at module.exports (/workspace/client/node_modules/babel-preset-react-app/create.js:168:9)
    at module.exports (/workspace/client/node_modules/babel-preset-react-app/index.js:19:10)
    at async (/workspace/client/node_modules/@babel/core/lib/gensync-utils/async.js:35:33)
    at async (/workspace/client/node_modules/gensync/index.js:186:15)
    at /workspace/client/node_modules/gensync/index.js:216:13
    at Generator.next (<anonymous>)
    at /workspace/client/node_modules/@babel/core/lib/config/full.js:180:21
    at Generator.next (<anonymous>)
    at Function.<anonymous> (/workspace/client/node_modules/@babel/core/lib/gensync-utils/async.js:21:3)
    at Generator.next (<anonymous>)
    at step (/workspace/client/node_modules/gensync/index.js:269:25)
    at evaluateAsync (/workspace/client/node_modules/gensync/index.js:291:5)
    at Function.errback (/workspace/client/node_modules/gensync/index.js:113:7)
    at errback (/workspace/client/node_modules/@babel/core/lib/gensync-utils/async.js:65:18)
    at async (/workspace/client/node_modules/gensync/index.js:188:17)
    at onFirstPause (/workspace/client/node_modules/gensync/index.js:216:13)
    at Generator.next (<anonymous>)
    at cachedFunction (/workspace/client/node_modules/@babel/core/lib/config/caching.js:52:46)
    at cachedFunction.next (<anonymous>)
    at loadPresetDescriptor (/workspace/client/node_modules/@babel/core/lib/config/full.js:292:43)
    at loadPresetDescriptor.next (<anonymous>)
    at recursePresetDescriptors (/workspace/client/node_modules/@babel/core/lib/config/full.js:77:31)
    at recursePresetDescriptors.next (<anonymous>)
    at /workspace/client/node_modules/@babel/core/lib/config/full.js:156:21
    at Generator.next (<anonymous>)
    at loadFullConfig (/workspace/client/node_modules/@babel/core/lib/config/full.js:113:5)
    at loadFullConfig.next (<anonymous>)
    at transform (/workspace/client/node_modules/@babel/core/lib/transform.js:20:44)
    at transform.next (<anonymous>)
    at step (/workspace/client/node_modules/gensync/index.js:269:25)
    at evaluateAsync (/workspace/client/node_modules/gensync/index.js:291:5)
    at errback (/workspace/client/node_modules/gensync/index.js:113:7)
    at stopHiding - secret - don't use this - v1 (/workspace/client/node_modules/@babel/core/lib/errors/rewrite-stack-trace.js:47:12)
    at transform (/workspace/client/node_modules/@babel/core/lib/transform.js:39:72)
    at node:internal/util:431:7
    at new Promise (<anonymous>)
    at transform (node:internal/util:417:12)
    at /workspace/client/node_modules/babel-loader/lib/transform.js:15:22
    at Generator.next (<anonymous>)
    at asyncGeneratorStep (/workspace/client/node_modules/babel-loader/lib/transform.js:3:103)
    at _next (/workspace/client/node_modules/babel-loader/lib/transform.js:4:194)
    at /workspace/client/node_modules/babel-loader/lib/transform.js:4:364
    at new Promise (<anonymous>)
    at /workspace/client/node_modules/babel-loader/lib/transform.js:4:97
    at /workspace/client/node_modules/babel-loader/lib/transform.js:48:17
    at /workspace/client/node_modules/babel-loader/lib/cache.js:130:26
    at ./src/index.js (https://octopus-app-bguru.ondigitalocean.app/static/js/bundle.js:10:7)
    at options.factory (https://octopus-app-bguru.ondigitalocean.app/static/js/bundle.js:10476:31)
    at __webpack_require__ (https://octopus-app-bguru.ondigitalocean.app/static/js/bundle.js:9939:32)
    at https://octopus-app-bguru.ondigitalocean.app/static/js/bundle.js:11053:37
    at https://octopus-app-bguru.ondigitalocean.app/static/js/bundle.js:11055:12
./src/index.js @ bundle.js:10
options.factory @ react refresh:6
__webpack_require__ @ bootstrap:22
(anonymous) @ startup:7
(anonymous) @ startup:7Understand this error
react refresh:6 WebSocket connection to 'wss://octopus-app-bguru.ondigitalocean.app:8080/ws' failed: 
WebSocketClient @ WebSocketClient.js:13
initSocket @ socket.js:27
./node_modules/webpack-dev-server/client/index.js?protocol=ws%3A&hostname=0.0.0.0&port=8080&pathname=%2Fws&logging=none&overlay=%7B%22errors%22%3Atrue%2C%22warnings%22%3Afalse%7D&reconnect=10&hot=true&live-reload=true @ index.js:320
options.factory @ react refresh:6
__webpack_require__ @ bootstrap:22
(anonymous) @ startup:5
(anonymous) @ startup:7
Show 3 more frames
Show lessUnderstand this error
WebSocketClient.js:13 WebSocket connection to 'wss://octopus-app-bguru.ondigitalocean.app:8080/ws' failed: 
WebSocketClient @ WebSocketClient.js:13
initSocket @ socket.js:27
(anonymous) @ socket.js:51
Show 3 more frames
Show lessUnderstand this error
WebSocketClient.js:13 WebSocket connection to 'wss://octopus-app-bguru.ondigitalocean.app:8080/ws' failed: 
WebSocketClient @ WebSocketClient.js:13
initSocket @ socket.js:27
(anonymous) @ socket.js:51
Show 3 more frames
Show lessUnderstand this error
WebSocketClient.js:13 WebSocket connection to 'wss://octopus-app-bguru.ondigitalocean.app:8080/ws' failed: 
WebSocketClient @ WebSocketClient.js:13
initSocket @ socket.js:27
(anonymous) @ socket.js:51
Show 3 more frames
Show lessUnderstand this error


This textbox defaults to using Markdown to format your answer.

You can type !ref in this text area to quickly search our full set of tutorials, documentation & marketplace offerings and insert the link!

Sign In or Sign Up to Answer
These answers are provided by our Community. If you find them useful, show some love by clicking the heart. If you run into issues leave a comment, or add your own answer to help others.
0
Bobby
Bobby
November 18, 2024

Hey,

I’ve not seen this one before, but it sounds like an issue where your React app is looking for the @babel/plugin-proposal-private-property-in-object plugin, which isn’t available and you need to make sure that you have it installed.

In your React project, open your terminal and install the missing plugin by running:

npm install @babel/plugin-proposal-private-property-in-object --save-dev

After making that change, push your code to your GitHub repository and force-redeploy your application on App Platform.

- Bobby

Become a contributor for community

Get paid to write technical tutorials and select a tech-focused charity to receive a matching donation.

Sign Up

DigitalOcean Documentation

Full documentation for every DigitalOcean product.

Learn more

Resources for startups and SMBs

The Wave has everything you need to know about building a business, from raising funding to marketing your product.

Learn more

Get our newsletter

Stay up to date by signing up for DigitalOcean’s Infrastructure as a Newsletter.

New accounts only. By submitting your email you agree to our Privacy Policy

The developer cloud

Scale up as you grow — whether you're running one virtual machine or ten thousand.

Get started for free

Sign up and get $200 in credit for your first 60 days with DigitalOcean.*

*This promotional offer applies to new accounts only.

© 2025 DigitalOcean, LLC.Sitemap.