如何解决“致命错误:堆限制附近的无效标记压缩无效分配失败-JavaScript堆内存不足”错误

H. *_*eem 6 node.js reactjs webpack

我正在尝试将reactjs应用程序部署到heroku。编译资产时,构建失败并产生以下错误:

-----> Ruby app detected
-----> Compiling Ruby/Rails
-----> Using Ruby version: ruby-2.5.1
-----> Installing dependencies using bundler 1.15.2
       Running: bundle install --without development:test --path vendor/bundle --binstubs vendor/bundle/bin -j4 --deployment
       Warning: the running version of Bundler (1.15.2) is older than the version that created the lockfile (1.16.3). We suggest you upgrade to the latest version of Bundler by running `gem install bundler`.
       Fetching gem metadata from https://rubygems.org/............
       Fetching version metadata from https://rubygems.org/..
       Fetching dependency metadata from https://rubygems.org/.
       Using rake 12.3.1
       Using concurrent-ruby 1.1.3
       Using minitest 5.11.3
       Using thread_safe 0.3.6
       Using builder 3.2.3
       Using erubi 1.7.1
       Using mini_portile2 2.3.0
       Using crass 1.0.4
       Using rack 2.0.6
       Using nio4r 2.3.1
       Using websocket-extensions 0.1.3
       Using mini_mime 1.0.1
       Using jsonapi-renderer 0.2.0
       Using arel 9.0.0
       Using mimemagic 0.3.2
       Using public_suffix 3.0.3
       Using airbrake-ruby 2.12.0
       Using execjs 2.7.0
       Using bcrypt 3.1.12
       Using popper_js 1.14.5
       Using rb-fsevent 0.10.3
       Using ffi 1.9.25
       Using bundler 1.15.2
       Using regexp_parser 1.3.0
       Using mime-types-data 3.2018.0812
       Using chartkick 3.0.1
       Using highline 2.0.0
       Using connection_pool 2.2.2
       Using orm_adapter 0.5.0
       Using method_source 0.9.2
       Using thor 0.19.4
       Using multipart-post 2.0.0
       Using geokit 1.13.1
       Using temple 0.8.0
       Using tilt 2.0.9
       Using hashie 3.5.7
       Using json 2.1.0
       Using mini_magick 4.9.2
       Using multi_json 1.13.1
       Using newrelic_rpm 5.5.0.348
       Using one_signal 1.2.0
       Using xml-simple 1.1.5
       Using pg 0.21.0
       Using puma 3.12.0
       Using rack-timeout 0.5.1
       Using redis 4.0.3
       Using secure_headers 6.0.0
       Using swagger-ui_rails 0.1.7
       Using i18n 1.1.1
       Using nokogiri 1.8.5
       Using tzinfo 1.2.5
       Using websocket-driver 0.7.0
       Using mail 2.7.1
       Using marcel 0.3.3
       Using addressable 2.5.2
       Using rack-test 1.1.0
       Using warden 1.2.8
       Using sprockets 3.7.2
       Using request_store 1.4.1
       Using rack-protection 2.0.4
       Using rack-proxy 0.6.5
       Using autoprefixer-rails 9.4.2
       Using uglifier 4.1.20
       Using airbrake 7.4.0
       Using rb-inotify 0.9.10
       Using mime-types 3.2.2
       Using commander 4.4.7
       Using net-http-persistent 3.0.0
       Using faraday 0.15.4
       Using hashie-forbidden_attributes 0.1.1
       Using omniauth 1.8.1
       Using haml 5.0.4
       Using slim 4.0.1
       Using paypal-sdk-core 0.3.4
       Using faker 1.9.1 from https://github.com/stympy/faker.git (at master@aca03be)
       Using money 6.13.1
       Using loofah 2.2.3
       Using xpath 3.2.0
       Using activesupport 5.2.0
       Using sidekiq 5.2.3
       Using sass-listen 4.0.0
       Using houston 2.4.0
       Using stripe 4.2.0
       Using paypal-sdk-adaptivepayments 1.117.1
       Using monetize 1.9.0
       Using rails-html-sanitizer 1.0.4
       Using capybara 3.12.0
       Using rails-dom-testing 2.0.3
       Using globalid 0.4.1
       Using activemodel 5.2.0
       Using case_transform 0.2
       Using decent_exposure 3.0.0
       Using factory_bot 4.11.1
       Using fast_jsonapi 1.5
       Using groupdate 4.1.0
       Using pundit 2.0.0
       Using sass 3.7.2
       Using actionview 5.2.0
       Using activerecord 5.2.0
       Using carrierwave 1.2.3
       Using activejob 5.2.0
       Using actionpack 5.2.0
       Using bootstrap 4.1.3
       Using actioncable 5.2.0
       Using actionmailer 5.2.0
       Using active_model_serializers 0.10.8
       Using activestorage 5.2.0
       Using railties 5.2.0
       Using sprockets-rails 3.2.1
       Using simple_form 4.1.0
       Using responders 2.4.0
       Using factory_bot_rails 4.11.1
       Using font-awesome-rails 4.7.0.4
       Using highcharts-rails 6.0.3
       Using jquery-rails 4.3.3
       Using lograge 0.10.0
       Using money-rails 1.13.0
       Using slim-rails 3.2.0
       Using webpacker 3.5.5
       Using rails 5.2.0
       Using sass-rails 5.0.7
       Using geokit-rails 2.3.1
       Using swagger-docs 0.2.9
       Using devise 4.5.0
       Using devise_token_auth 1.0.0
       Bundle complete! 68 Gemfile dependencies, 125 gems now installed.
       Gems in the groups development and test were not installed.
       Bundled gems are installed into ./vendor/bundle.
       Bundle completed (5.09s)
       Cleaning up the bundler cache.
       Warning: the running version of Bundler (1.15.2) is older than the version that created the lockfile (1.16.3). We suggest you upgrade to the latest version of Bundler by running `gem install bundler`.
       The latest bundler is 2.0.1, but you are currently running 1.15.2.
       To update, run `gem install bundler`
-----> Installing node-v10.14.1-linux-x64
-----> Installing yarn-v1.12.3
-----> Detecting rake tasks
-----> Preparing app for Rails asset pipeline
       Running: rake assets:precompile
       yarn install v1.12.3
       warning package-lock.json found. Your project contains lock files generated by tools other than Yarn. It is advised not to mix package managers in order to avoid resolution inconsistencies caused by unsynchronized lock files. To clear this warning, remove package-lock.json.
       [1/5] Validating package.json...
       [2/5] Resolving packages...
       [3/5] Fetching packages...
       info fsevents@1.2.4: The platform "linux" is incompatible with this module.
       info "fsevents@1.2.4" is an optional dependency and failed compatibility check. Excluding it from installation.
       [4/5] Linking dependencies...
       warning "@rails/webpacker > postcss-cssnext@3.1.0" has unmet peer dependency "caniuse-lite@^1.0.30000697".
       warning " > react-addons-css-transition-group@15.6.2" has incorrect peer dependency "react@^15.4.2".
       warning " > react-bootstrap-table-next@1.4.0" has unmet peer dependency "classnames@^2.2.5".
       warning " > react-progressbar@15.4.1" has incorrect peer dependency "react@^15.0.1".
       warning " > redux-immutable@4.0.0" has unmet peer dependency "immutable@^3.8.1 || ^4.0.0-rc.1".
       warning "eslint-config-airbnb > eslint-config-airbnb-base@11.3.2" has incorrect peer dependency "eslint-plugin-import@^2.7.0".
       warning " > webpack-dev-server@2.11.2" has unmet peer dependency "webpack@^2.2.0 || ^3.0.0".
       warning "webpack-dev-server > webpack-dev-middleware@1.12.2" has unmet peer dependency "webpack@^1.0.0 || ^2.0.0 || ^3.0.0".
       [5/5] Building fresh packages...
       $ cd client && yarn
       yarn install v1.12.3
       warning package-lock.json found. Your project contains lock files generated by tools other than Yarn. It is advised not to mix package managers in order to avoid resolution inconsistencies caused by unsynchronized lock files. To clear this warning, remove package-lock.json.
       [1/5] Validating package.json...
       [2/5] Resolving packages...
       [3/5] Fetching packages...
       info fsevents@1.2.4: The platform "linux" is incompatible with this module.
       info "fsevents@1.2.4" is an optional dependency and failed compatibility check. Excluding it from installation.
       [4/5] Linking dependencies...
       warning " > babel-loader@7.1.0" has unmet peer dependency "webpack@2 || 3".
       warning " > react-intl@2.3.0" has incorrect peer dependency "react@^0.14.9 || ^15.0.0".
       warning " > react-router-dom@4.1.1" has incorrect peer dependency "react@^15".
       warning " > react-router-redux@5.0.0-alpha.6" has incorrect peer dependency "react@^15".
       warning " > enzyme@2.8.2" has incorrect peer dependency "react@0.13.x || 0.14.x || ^15.0.0-0 || 15.x".
       warning " > eslint-import-resolver-webpack@0.8.3" has unmet peer dependency "webpack@>=1.11.0".
       warning " > html-webpack-plugin@2.29.0" has unmet peer dependency "webpack@1 || ^2 || ^2.1.0-beta || ^2.2.0-rc || ^3".
       warning "image-webpack-loader > file-loader@1.1.11" has unmet peer dependency "webpack@^2.0.0 || ^3.0.0 || ^4.0.0".
       warning " > react-test-renderer@15.6.1" has incorrect peer dependency "react@^15.6.1".
       [5/5] Building fresh packages...
       Done in 31.85s.
       Done in 76.09s.
       Webpacker is installed  
       Using /tmp/build_8f521e11fc612876bcd3c01cd8da6bdd/config/webpacker.yml file for setting up webpack paths
       Compiling…
       Compilation failed:
       FATAL ERROR: Ineffective mark-compacts near heap limit Allocation failed - JavaScript heap out of memory
        1: 0x8dbaa0 node::Abort() [node]
        2: 0x8dbaec  [node]
        3: 0xad83de v8::Utils::ReportOOMFailure(v8::internal::Isolate*, char const*, bool) [node]
        4: 0xad8614 v8::internal::V8::FatalProcessOutOfMemory(v8::internal::Isolate*, char const*, bool) [node]
        5: 0xec5c42  [node]
        6: 0xec5d48 v8::internal::Heap::CheckIneffectiveMarkCompact(unsigned long, double) [node]
        7: 0xed1e22 v8::internal::Heap::PerformGarbageCollection(v8::internal::GarbageCollector, v8::GCCallbackFlags) [node]
        8: 0xed2754 v8::internal::Heap::CollectGarbage(v8::internal::AllocationSpace, v8::internal::GarbageCollectionReason, v8::GCCallbackFlags) [node]
        9: 0xed53c1 v8::internal::Heap::AllocateRawWithRetryOrFail(int, v8::internal::AllocationSpace, v8::internal::AllocationAlignment) [node]
       10: 0xe9e844 v8::internal::Factory::NewFillerObject(int, bool, v8::internal::AllocationSpace) [node]
       11: 0x113dfae v8::internal::Runtime_AllocateInNewSpace(int, v8::internal::Object**, v8::internal::Isolate*) [node]
       12: 0x2daefc5be1d 


       <--- Last few GCs --->

       [587:0x2713f20]  1469419 ms: Mark-sweep 1362.0 (1417.7) -> 1361.9 (1418.2) MB, 1183.8 / 0.0 ms  (average mu = 0.099, current mu = 0.004) allocation failure scavenge might not succeed
       [587:0x2713f20]  1470575 ms: Mark-sweep 1363.1 (1418.7) -> 1362.9 (1419.7) MB, 1151.7 / 0.0 ms  (average mu = 0.053, current mu = 0.004) allocation failure scavenge might not succeed


       <--- JS stacktrace --->

       ==== JS stack trace =========================================

           0: ExitFrame [pc: 0x2daefc5be1d]
       Security context: 0x395bbaa1e6e1 <JSObject>
           1: addMappingWithCode [0x1a4bb3f1a89] [/tmp/build_8f521e11fc612876bcd3c01cd8da6bdd/node_modules/webpack-sources/node_modules/source-map/lib/source-node.js:~150] [pc=0x2daf487dfd2](this=0x08663a09ad49 <JSGlobal Object>,mapping=0x2969e26a1e61 <Object map = 0x1067d74ad2e1>,code=0x3e38d99f4479 <String[6]: break >)
           2: /* anonymous */ [0x1a4bb3dcc79] [/tmp/...


 !
 !     Precompiling assets failed.
 !
 !     Push rejected, failed to compile Ruby app.
 !     Push failed

Run Code Online (Sandbox Code Playgroud)

我在package.json文件中尝试了多种方法:

"scripts" : {
   "start": "cross-env NODE_OPTIONS=--max_old_space_size=5120 webpack"
}

"scripts" : {
  "webpacker": "node --max-old-space-size=4096 node_modules/.bin/react-scripts start"
}

"scripts" : {
  "start": "node --max-old-space-size=6144 client/app/app.js"
}

Run Code Online (Sandbox Code Playgroud)

我研究并发现了各种github和stackoverflow线程,但它们似乎无法解决我的问题。

这是我的package.json文件:

{
  "name": "safe_deliver",
  "private": true,
  "engines": {
    "node": ">=6.0.0",
    "yarn": ">=0.25.2"
  },
  "scripts": {
    "postinstall": "cd client && yarn",
    "pre-commit": "cd client && npm run lint:staged",
    "start": "cross-env NODE_OPTIONS=--max-old-space-size=6144 bin/webpack"
  },
  "dependencies": {
    "@fortawesome/fontawesome": "^1.1.8",
    "@fortawesome/fontawesome-free": "^5.3.1",
    "@fortawesome/fontawesome-free-brands": "^5.0.13",
    "@fortawesome/fontawesome-free-regular": "^5.0.13",
    "@fortawesome/fontawesome-free-solid": "^5.0.13",
    "@fortawesome/fontawesome-svg-core": "^1.2.4",
    "@fortawesome/free-solid-svg-icons": "^5.3.1",
    "@fortawesome/react-fontawesome": "^0.1.3",
    "@rails/webpacker": "^3.3.1",
    "babel-plugin-emotion": "^9.2.6",
    "babel-preset-react": "^6.24.1",
    "babel-preset-stage-0": "^6.24.1",
    "bootstrap": "4.0.0",
    "chart.js": "^2.7.3",
    "chartkick": "^3.0.1",
    "emotion": "^9.2.6",
    "google-maps-react": "^2.0.2",
    "jquery": "^3.2.1",
    "jquery-ujs": "^1.2.2",
    "leaflet": "^1.3.1",
    "normalize.css": "^8.0.1",
    "popper.js": "^1.12.9",
    "prop-types": "^15.6.1",
    "rc-time-picker": "^3.6.2",
    "react": "^16.4.1",
    "react-addons-css-transition-group": "^15.6.2",
    "react-animate-height": "^2.0.5",
    "react-bootstrap-table-next": "^1.4.0",
    "react-calendar": "^2.16.0",
    "react-datepicker": "^2.3.0",
    "react-dom": "^16.4.1",
    "react-emotion": "^9.2.6",
    "react-fontawesome": "^1.6.1",
    "react-geocode": "^0.1.2",
    "react-https-redirect": "^1.0.11",
    "react-input-mask": "^2.0.4",
    "react-progressbar": "^15.4.1",
    "react-star-rating-component": "^1.4.1",
    "react-stripe-elements": "^2.0.1",
    "reactjs-popup": "^1.3.2",
    "redux-immutable": "^4.0.0",
    "reset-css": "^4.0.1",
    "seamless-immutable": "^7.1.4",
    "styled-components": "^3.4.2"
  },
  "devDependencies": {
    "eslint": "3.19.0",
    "eslint-config-airbnb": "15.0.1",
    "eslint-plugin-import": "2.2.0",
    "eslint-plugin-jsx-a11y": "5.0.3",
    "eslint-plugin-react": "7.0.1",
    "pre-commit": "1.2.2",
    "webpack-dev-server": "^2.7.1"
  }
}

Run Code Online (Sandbox Code Playgroud)

我期望该错误消失,并且将部署该应用程序。现在,它正在抛出javascript堆内存不足错误。

小智 36

部署到 Heroku 时,我遇到了类似的堆分配错误。该应用程序仍会正确构建,但不会在浏览器中加载。Heroku 日志会告诉我这个:致命错误:接近堆限制的无效标记压缩分配失败 - JavaScript 堆内存不足

在尝试了十几种不同的东西后,这似乎在 package.json 中起作用:

 "start": "react-scripts --max_old_space_size=4096 start",
 "build": "react-scripts --max_old_space_size=4096 build",
Run Code Online (Sandbox Code Playgroud)

  • 这解决了问题 (2认同)

Jos*_*dez 34

该问题与项目中的大文件有关。

我正在使用 create-react-app,我得到了那个错误,在做了一些搜索之后,似乎一个解决方案是这样的。

放入.env文件:

GENERATE_SOURCEMAP=false
Run Code Online (Sandbox Code Playgroud)

  • 什么是 .env 文件?我在项目中没有看到 .env 文件 (3认同)
  • 我尝试先更改 package.json 但这没有帮助。然后我保留了 package.json 更改并更改了 .env 文件并能够部署。对我来说,这一切似乎都是黑魔法,但感谢社区提供了解决方案。顺便说一句 - 回答 Oliver 的问题:我们使用 .env 文件来存储密钥和 ID。它通常是一个隐藏文件,因此我们使用shift-cmd-。显示 Mac 上的文件。它被 git 忽略,因此不会被推送到 git。我们必须单独上传它才能运行程序。希望有帮助。 (2认同)

Avi*_*iro 13

问题的根本原因是源文件过大。
如果下划线问题在您的源代码中,您可以通过简单地增加节点堆大小来解决它,如下所示,

"start": "react-scripts --max_old_space_size=4096 start",
"build": "react-scripts --max_old_space_size=4096 build",
但是如果问题出在引入的任何依赖项中,我们可能需要全局增加节点堆分配来解决问题。

对于 Windows:

set NODE_OPTIONS=--max_old_space_size=4096
Run Code Online (Sandbox Code Playgroud)

对于 Linux:

export NODE_OPTIONS=--max_old_space_size=4096
Run Code Online (Sandbox Code Playgroud)


kem*_*ica 6

针对那些运行反应脚本的人的解决方案。

在没有事先确定生产设置的情况下,您应该将带有反应脚本的反应应用程序部署到生产环境中。

react-scripts start仅用于开发和热模块重新加载,如果您运行免费或低层版本的 Heroku,则会出现内存不足的情况(因为没有为您的项目分配足够的 RAM)。开发模式使用更多的资源。Heroku 和类似平台默认配置为运行命令yarn buildyarn start(或使用 npm)。

如果您检查 Heroku 日志,您会注意到您的应用程序正在开发模式下运行。

您甚至会注意到,当您yarn build在终端中运行时,它会显示:

File sizes after gzip:

  193.81 kB (+4 B)  build/static/js/main.e2ea9faa.js
  1.78 kB           build/static/js/787.1d6a0bb1.chunk.js

The project was built assuming it is hosted at /.
You can control this with the homepage field in your package.json.

The build folder is ready to be deployed.
You may serve it with a static server:

  yarn global add serve
  serve -s build

Find out more about deployment here:

  https://cra.link/deployment
Run Code Online (Sandbox Code Playgroud)

我建议将start脚本重命名为dev(即:)yarn dev,然后将start脚本设置为:

serve -s build
Run Code Online (Sandbox Code Playgroud)

(不要忘记安装它yarn add serve


小智 5

这是因为您的反应应用程序中有更多的“js”文件。您可以在 package.json 中进行一些更改后构建您的应用程序,如下代码所示:

"scripts": {
        "start": "react-scripts --max_old_space_size=4096 start",
        "build": "react-scripts --max_old_space_size=4096 build",
        "test": "react-scripts test",
        "eject": "react-scripts eject"
      },
Run Code Online (Sandbox Code Playgroud)


小智 5

我通过在终端中运行以下命令解决了 React js 中的这个问题

set NODE_OPTIONS=--max_old_space_size=8096
Run Code Online (Sandbox Code Playgroud)