Webpacker: WebPacker Compiles forever

[Bdoom]

bundle exec rails webpacker:compile
Compiling…

I just setup my project on a new ubuntu server and when I run the following command it just says "Compiling..." forever! It will sit on this forever. What do I do?

[jakeNiemiec]

In order to help debug, could you please post as much as you can of:

• How much memory does the server have?
• ./package.json
• ./config/webpack/environment.js
• ./config/webpacker.yml
• ./app/javascript/packs/application.js
• any error message (even the parts you wouldn’t think of as relevant)

[rossta]

Also, what's the layout of your JS source? One possible cause of slow compilation times with Webpacker is putting many JS source files in app/javascript/packs.

[KevinKP17]

Also, what's the layout of your JS source? One possible cause of slow compilation times with Webpacker is putting many JS source files in app/javascript/packs.

can you define "many" how many files should we have as entry ??

i also have problem with webpack-dev-server compile time. i have 4 entry files that only import scss files only, yet the compiling took 3x longer from build time this is frustrating

[jakeNiemiec]

can you define "many" how many files should we have as entry ??

The more entryfiles you have, the more likely webpacker will start to slow down. This is not always the case, but there are a handful things that can really improve the situation from the webpack side.

3x longer

How long total? Are they the same scss files? How many?

[KevinKP17]

Notes

1. 4 js entrypoint
2. 4 scss entrypoint
3. each entrypoint have ~ 17 @import
4. fully utilize scss capability @mixin, @import, variables

Webpack time

1. First Build Time
   using webpack-dev-server
   Time: 10056ms

2. webpack dev server watch compiles
   Time: 86049ms

i'm frustrated, maybe i should monkey patch it to fast-sass-loader

[jakeNiemiec]

10s is pretty good for that much scss (17 imports).

The only tip I can give is try and make your scss as "flat" as possible. When you change something in scss, it needs to recompile that file AND every file that depends on it. Therefore, isolating styles will limit the amount of re-compiling required. I know it can be tricky to do this with scss @imports.

[KevinKP17]

@jakeNiemiec the problem lies on the precompile on files changes
it tooks a whooping 86s from 10s
right now its faster to rebuild rather than ask webpack to watch the files change

[jakeNiemiec]

That does not sound right, do you have a custom ./config/webpack/environment.js?

[KevinKP17]

i just found out that my config is not pure
we add stylelint and bundleranalyzer to our development.js config
i've tried to remove it and achieve 1x to ~ 1.5x time on compiling changes with webpack-dev-server (from first build)

[guillaumebriday]

Could this issue be closed ?