Memory usage of nuxt dev with typescript grows indefinitely

[guaneec]

Describe the bug
The memory usage of nuxt with typescript enabled seems to grow unbounded with each reload of nuxt.config.js

To Reproduce
Steps to reproduce the behavior:

1. Create a project using yarn create nuxt-app myproject. Choose typescript for the programming language and use default for all other options.
2. Run yarn dev
3. Open nuxt.config.js in your editor and just save it to trigger a nuxt build.
4. Repeat 3. a couple times.
5. Memory usage as reported by nuxt grows indefinitely

Expected behavior
Memory usage should stay below ~500MB

Screenshots
If applicable, add screenshots to help explain your problem.
Language: typescript (bug):

Language: javascript (expected):

Additional context

With lang=ts, if I run node --trace-warnings node_modules/.bin/nuxt >/dev/null, I get a stack trace:

 ERROR  (node:1066) MaxListenersExceededWarning: Possible EventEmitter memory leak detected. 12 exit listeners added to [process]. Use emitter.setMaxListeners() to increase limit
    at _addListener (events.js:390:17)
    at process.addListener (events.js:406:10)
    at ForkTsCheckerWebpackPlugin.pluginStop ([PROJECT_ROOT]/node_modules/fork-ts-checker-webpack-plugin/lib/index.js:225:17)
    at ForkTsCheckerWebpackPlugin.apply ([PROJECT_ROOT]/node_modules/fork-ts-checker-webpack-plugin/lib/index.js:190:14)
    at webpack ([PROJECT_ROOT]/node_modules/webpack/lib/webpack.js:51:13)
    at [PROJECT_ROOT]/node_modules/@nuxt/webpack/dist/webpack.js:5280:24
    at Array.map (<anonymous>)
    at WebpackBundler.build ([PROJECT_ROOT]/node_modules/@nuxt/webpack/dist/webpack.js:5279:37)
    at async Builder.build ([PROJECT_ROOT]/node_modules/@nuxt/builder/dist/builder.js:5602:5)
    at async Object._buildDev ([PROJECT_ROOT]/node_modules/@nuxt/cli/dist/cli-dev.js:102:5)
    at async Object.startDev ([PROJECT_ROOT]/node_modules/@nuxt/cli/dist/cli-dev.js:60:7)
    at async Object.onWatchRestart ([PROJECT_ROOT]/node_modules/@nuxt/cli/dist/cli-dev.js:131:5)
    at async Nuxt.callHook ([PROJECT_ROOT]/node_modules/hable/dist/hable.js:1:1021)
    at async FSWatcher.<anonymous> ([PROJECT_ROOT]/node_modules/@nuxt/builder/dist/builder.js:6214:9)

Tested on WSL 1 (Ubuntu 18.04.2 LTS)

[kevinmarrec]

@guaneec Sounds to be related to the ForkTsCheckerWebpackPlugin, and regarding your trace it seems to be a memory leak around their source code.

So unless there's something we don't call to clear something, it may be something we can't fix here 🤔

[kevinmarrec]

Also, It's normal TypeScript uses more memory than JavaScript by default, and it also caches more thing overtime when doing multiple reloads.

I have not being able to easily reproduce the memory leak error though.

[crutch12]

Have same problem using npm :(

[kevinmarrec]

Upgrade to last version of fork-ts-checker-webpack-plugin will probably make it better, I'll ping here when it's released.

[crutch12]

Didn't help, every nuxt.config.js (add/remove random plugin) change increase memory usage on ~400mb (in my case)

602mb
...
1.12gb
...
1.42gb
...
1.81gb
...
out of memory

--

By the way: here is my module config

['@nuxt/typescript-build', {
  typeCheck: {
    typescript: {
      memoryLimit: 4096,
      // workers: 2
    },
  },
}],

But project drops when memory is more then default limit (2048)

[kevinmarrec]

@guaneec Issue doesn't happen if memoryLimit is default ?

[crutch12]

@kevinmarrec looks like you wanted to call me, not guaneec

Pass

buildModules: ['@nuxt/typescript-build']

leads to same result

[kevinmarrec]

Indeed sorry @guaneec for the ping 🙈

@crutch12 The thing is nuxt.config file change leads to a full server rebuild, which shouldn't happen much in development.
Also some nuxt.config file changes sometimes need to restart manually.

So I don't think it's really something painful, as well as I don't know if it's fixable, it's more likely dependent to dependencies we're using and not the module itself :/

[crutch12]

But why memory limit option doesn't work?

[kevinmarrec]

@crutch12 Maybe you're being mistaken between Nuxt Memory usage & https://github.com/TypeStrong/fork-ts-checker-webpack-plugin type checking memory limit ?

[kevinmarrec]

Any updates @crutch12 ?

[crutch12]

Looks like that

I think I have to use --max-old-space-size=4096 for memory limit, did not have time to check

[Eygle]

I references this problem here: nuxt/nuxt#7412 the problem is present even without typescript (maybe it's a clue).

We "patched" it by running nuxt-ts inside a pm2 instance with a memory limit and auto reload on crash.
It's not ideal nor a solution but it helps us developers to work without having to restart nuxt every time it crashed due to memory limit.

Here is the part of pm2 conf that may (or not) interest you:

{
    "script" : "./node_modules/.bin/nuxt-ts",
    "args": "dev",
    "instances" : "1",
    "exec_mode" : "fork",
    "max_memory_restart": "1536M"
}

dev being a reference to the package.json script "dev": "nuxt-ts"

[crutch12]

@kevinmarrec nuxt --max-old-space-size=8192 --optimize_for_size doesn't help, application crash when gets out of 2gb memory usage

[kevinmarrec]

I'm not sure how can I help if it's also reproducible without TypeScript :/

[harrytran998]

👀 1 here. After one time to press CTRL + S --> The memory usage increasing! After N times! It will be crashed!
In the beginning ---> ~500mb

After N times CTRL + S 🤷‍♀️

Yeah, after XYZ times CTRL + S --> It's break totally!

@kevinmarrec hope you can check it!

[Eygle]

The problem seems to have been fixed!

nuxt/nuxt#8522
nuxt/nuxt#8523

[danielroe]

If anyone else would like to test with nuxt-edge to see whether the PR that @Eygle mentions has solved the issue for you that would be much appreciated. ❤️

[Eygle]

Careful it is on branch develop but not released yet

[danielroe]

@Eygle nuxt-edge already includes this PR, which is why I asked people to test with it 🙃

[Eygle]

@Eygle nuxt-edge already includes this PR, which is why I asked people to test with it

My bad, I didn't know this package