CODEWITHSUNDEEP
javascriptnode.jsreactjsnpmnext.js
Nitesh Jha
Nitesh Jha

Reputation: 129

Creating an optimized build freezes and never completes

I am trying to build my react app. But when I run "npm run build", the terminal freezes on "Creating and optimized production build..." and never finishes. This is my JSON file. I tried on 16 GB ram also.

I have deleted package lock file and also rebuilt the dependencies. But it remains thr same. There is no specific solution anywhere, if anyone has solution please let me know.

{
  "name": "demoapp",
  "version": "0.1.0",
  "private": true,
  "dependencies": {
    "@emotion/react": "^11.4.1",
    "@emotion/styled": "^11.3.0",
    "@material-ui/core": "^4.12.2",
    "@material-ui/data-grid": "^4.0.0-alpha.33",
    "@material-ui/lab": "^4.0.0-alpha.60",
    "@mui/material": "^5.0.3",
    "@progress/kendo-drawing": "^1.16.0",
    "@progress/kendo-licensing": "^1.2.1",
    "@progress/kendo-react-pdf": "^4.12.0",
    "@progress/kendo-theme-material": "^4.43.0",
    "@progress/kendo-ui": "^2021.3.1109",
    "@testing-library/jest-dom": "^5.11.4",
    "@testing-library/react": "^11.1.0",
    "@testing-library/user-event": "^12.1.10",
    "axios": "^0.21.1",
    "bootstrap": "^5.0.2",
    "chart.js": "^3.5.0",
    "dom-to-pdf": "^0.2.2",
    "draft-js": "^0.11.7",
    "draftjs-to-html": "^0.9.1",
    "html-to-draftjs": "^1.5.0",
    "pdf-viewer-reactjs": "^2.2.3",
    "react": "^17.0.2",
    "react-app-polyfill": "^2.0.0",
    "react-chartjs-2": "^3.0.4",
    "react-csv": "^2.0.3",
    "react-dom": "^17.0.2",
    "react-draft-wysiwyg": "^1.14.7",
    "react-hook-form": "^7.10.1",
    "react-icons": "^4.2.0",
    "react-loader": "^2.4.7",
    "react-loader-spinner": "^4.0.0",
    "react-modal-video": "^1.2.8",
    "react-redux": "^7.2.4",
    "react-responsive-carousel": "^3.2.21",
    "react-router-dom": "^5.2.0",
    "react-scripts": "^4.0.3",
    "react-table": "^7.7.0",
    "reactstrap": "^8.9.0",
    "redux": "^4.1.0",
    "redux-thunk": "^2.3.0",
    "sweetalert2": "^11.0.18",
    "web-vitals": "^1.0.1"
  },
  "scripts": {
    "start": "react-scripts start",
    "build": "react-scripts build",
    "test": "react-scripts test",
    "eject": "react-scripts eject"
  },
  "eslintConfig": {
    "extends": [
      "react-app",
      "react-app/jest"
    ]
  },
  "browserslist": {
    "production": [
      ">0.2%",
      "not dead",
      "not op_mini all"
    ],
    "development": [
      "ie 11",
      "last 1 chrome version",
      "last 1 firefox version",
      "last 1 safari version"
    ]
  }
}

Upvotes: 12

Views: 23859

Answers (5)

Sahil Gupta
Sahil Gupta

Reputation: 78

Im using ec2 and it happened due to low RAM on the server. To resolve this you can create an SWAP area which the OS can use as a temporary space to store data that it can no longer hold in RAM. Below are steps to create a swap file on a Unix-based system:

Create a Swap File: sudo fallocate -l 4G /swapfile

Secure the Swap File: sudo chmod 600 /swapfile

Set Up the Swap Space: sudo mkswap /swapfile

Enable the Swap File: sudo swapon /swapfile

Verify the Swap Space: sudo swapon --show

The above command will produce output similar to this: NAME TYPE SIZE USED PRIO /swapfile file 4G 0B -2

Then run: export NODE_OPTIONS=--max_old_space_size=4096 && npm run build

This helps to solve the problem. More to read on SWAP area here

Upvotes: 2

jaycethanks
jaycethanks

Reputation: 65

I've also encountered this issue. I searched for many solutions and finally discovered that it was due to the insufficient memory on my server. The server got stuck while packaging because of the low memory. Please check if your server's memory usage is normal. If you're facing a similar problem, I recommend stopping other services first and then proceeding with the packaging

Upvotes: 1

Bar Kazzaz
Bar Kazzaz

Reputation: 31

If the process is stuck, it could be due to a lack in computing resources.

I would recommend investigating the currently running processes.

Try running sudo htop on a different terminal window and then run sudo npm run build.

You might find another process is taking too much memory, causing the build process to hang.

You may need to kill or restart such processes to complete the build. It would be a good idea to check why those processes take so much memory, but that's besides the topic.

Upvotes: 1

Yusuf Ganiyu
Yusuf Ganiyu

Reputation: 1095

I recently had this issue. Check your package.json for react-scripts, if the version is <5.0.0 upgrade it to at least "react-scripts": "5.0.0".

Do a yarn install or npm install again, then yarn build or npm run build as the case may be.

Let me know if this works for you! Cheers!

Upvotes: 1

Daryn Brown
Daryn Brown

Reputation: 131

Check to see if you have a local server running in another terminal (eg. localhost:3000 ).

If you do, end that server instance by terminating the batch job (with Ctrl+C) and try running npm run build again.

Upvotes: 11

Related Questions