When the resolver is working through its version of the node module resolution algorithm, it has to perform a large number of file system operations to determine what an ambiguous require/import string is. This means, every extension webpack needs to look for can drastically increase the number of disk hits necessary when enhanced-resolve
is attempting to locate an import.
Only have webpack's resolver look for the file extensions you use very frequently in your application. For most JS projects, this means using the following webpack config:
resolve: {
extensions: ['.js'] // webpack's default is [".js", ".json", ".node"]
}
For all other types of files (json
, css
, etc) explicitly add the extension in your import/require.
Example Disk Hits - Before/After
It's worth noting that this could break dependencies that rely on requiring JSON without a file extension. However, that's not likely to be found in most packages distributed for front-end use.
The modules
configuration for enhanced-resolve
specifies a list of directories that should always be looked in when resolving modules. This can add thousands of extra hits to the disk during your build. This can be substantially worse when a non-absolute path is used, because enhanced-resolve
will keep looking all the way up the file system to the root for that directory.
Make sure you are not abusing resolve.modules
in places where resolve.alias
would be more appropriate.