网站搜索

typescript - NextJS - 致命错误:接近堆限制的无效标记-整理,分配失败 - JavaScript 堆内存不足


我有一个 NextJS TypeScript 应用程序,有 30 个页面和一些依赖。我正在尝试在具有 512MB 内存的免费实例上构建它,但构建有时甚至无法完成类型有效性检查这一步。我收到的错误是 FATAL ERROR: Ineffective mark-compacts near heap limit Allocation failed - JavaScript heap out of memory

这是 package.json

{
      "name": "app",
      "scripts": {
        "dev": "next dev",
        "build": "NODE_OPTIONS=\" --max-old-space-size=512\"  next build",
        "prestart": "npm run build",
        "start": "NODE_OPTIONS=\"--max-old-space-size=512\" next start","test": "start-server-and-test dev 3000 cypress:open",
        "type:check": "yarn tsc --project tsconfig.json --pretty --noEmit",
        "prepare": "husky install"
      },
      "dependencies": {
        "@fortawesome/fontawesome-svg-core": "^1.3.0",
        "@fortawesome/free-regular-svg-icons": "^6.0.0",
        "@fortawesome/free-solid-svg-icons": "^6.0.0",
        "@fortawesome/react-fontawesome": "^0.1.17",
        "@lexical/react": "^0.7.1",
        "@reduxjs/toolkit": "^1.7.2",
        "@tangdw/react-viewer": "^3.2.7",
        "antd": "^4.18.8",
        "antd-dayjs-webpack-plugin": "^1.0.6",
        "autoprefixer": "^10.4.7",
        "bootstrap": "5.1.3",
        "country-list": "^2.2.0",
        "draft-js": "^0.11.7",
        "draftjs-to-html": "^0.9.1",
        "formik": "^2.2.9",
        "formik-antd": "^2.0.4",
        "html-to-draftjs": "^1.5.0",
        "jsonwebtoken": "^8.5.1",
        "jwt-decode": "^3.1.2",
        "lodash": "^4.17.21",
        "moment": "^2.29.1",
        "next": "12.0.10",
        "next-pwa": "^5.6.0",
        "nprogress": "^0.2.0",
        "postcss": "^8.4.14",
        "query-string": "^7.1.1",
        "react": "17.0.2",
        "react-dom": "17.0.2",
        "react-draft-wysiwyg": "^1.15.0",
        "react-feather": "^2.0.10",
        "react-icons": "^4.3.1",
        "react-multi-carousel": "^2.8.0",
        "react-redux": "^7.2.6",
        "react-share": "^4.4.1",
        "react-show-more-text": "^1.5.2",
        "react-slick": "^0.29.0",
        "react-typical": "^0.1.3",
        "react-viewer": "^3.2.2",
        "tailwindcss": "^3.0.24",
        "yup": "^0.32.11"
      },
      "devDependencies": {
        "@types/node": "17.0.15",
        "@types/react": "17.0.39",
        "@types/react-show-more-text": "^1.4.2",
        "@typescript-eslint/eslint-plugin": "^5.11.0",
        "@typescript-eslint/parser": "^5.11.0",
        "@types/jsonwebtoken": "^8.5.8",
        "@types/nprogress": "^0.2.0",
        "@types/react-typical": "^0.1.0",
        "cypress": "^9.5.1",
        "eslint": "8.8.0",
        "eslint-config-next": "12.0.10",
        "eslint-config-prettier": "^8.3.0",
        "eslint-plugin-jsx-a11y": "^6.5.1",
        "eslint-plugin-prettier": "^4.0.0",
        "eslint-plugin-react": "^7.28.0",
        "eslint-plugin-react-hooks": "^4.3.0",
        "husky": ">=6",
        "lint-staged": ">=10",
        "miragejs": "^0.1.43",
        "prettier": "2.5.1",
        "start-server-and-test": "^1.14.0",
        "typescript": "4.5.5"
      },
    }

有办法处理那个吗?

答案#1

看起来只是内存不足。最近我在用 8GB RAM 的 VPS 构建时遇到了内存问题。但当时有几个项目运行。所以我可以建议购买一个更强大的实例。

512 MB 可能不足以容纳 30 页。

答案#2

另一种选择是在本地进行构建,然后将构建文件手动上传到服务器。

我以前在我的服务器上做这个。