Resolving

Resolve is used to find “import” and “require” references that are not immediately available in the current path. For example: how a call to require("../homepage") might be translated to ("../homepage/index.js") or how an import react from 'react' might be interpreted if your node_modules folder is named something else. For more configuration options click here

The resolving process is pretty simple and distinguishes between three types of requests:

• absolute path: require("/home/me/file"), require("C:\\Home\\me\\file")
• relative path: require("../src/file"), require("./file")
• module path: require("module"), require("module/lib/file")

Resolving an absolute path

We first check if the path points to a directory. For a directory we need to find the main file in this directory. Therefore the main field in the package.json is joined to the path. If there is no package.json or no main field, index is used as filename.

Now that Resolve has an absolute path to a file it attempts to append all extensions (configuration option: resolve.extensions). The first existing file is used as the result.

Resolving a relative path

Webpack’s context value is assumed to be the directory of the resource file that contains the require statement. If no resource file is found at Webpack’s context, Resolve’s context configuration option is used as the context directory. (This can occur for entry points or with loader-generated files).

When the resource file is found, its relative path is joined to the context directory and the resulting absolute file is resolved according to “Resolving an absolute path”.

Resolving a module path

For resolving a module Resolve first gathers all search directories for modules from Webpack’s context directory. This process is similar to the node.js resolving process, but the search directories are configurable with the configuration option resolve.modulesDirectories. In addition to this the directories in the configuration option resolve.root are prepended, and directories in the configuration option resolve.fallback are appended.

The module is looked up in each module directory and resolved according to “Resolving an absolute path”. If the first match has no success, the second is tried, and so on.

Aliasing

Resolve’s configuration option resolve.alias renames modules.

When trying to “resolve a module path” the module name is matched to the resolve.alias option. When there is a match, the matching module name is replaced with the alias.

Caching

Every filesystem access is cached so that multiple parallel or serial requests to the same resource are merged. In watching mode only changed files are removed from cache (the watcher knows which files have been changed). In non-watching mode the cache is purged before every compilation.

Unsafe caching

Resolve’s configuration option resolve.unsafeCache boosts performance by “aggressive caching”. This means that every resolve process is cached and isn’t ever purged. This results in correct behavior in most cases, but there is a chance of incorrect behavior in edge cases.

Context

When trying to resolve a context “Resolving an absolute path” ends when a directory is found.

Loaders

For loaders the configuration options in resolveLoader are used.

Additionally, when trying to “resolve a module path” all module name variations in Resolve’s configuration option resolveLoader.moduleTemplates are tried.

Asynchronous

The above description suggests a serial process, but in the implementation the process is completely asynchronous and parallel. This may cause more filesystem access than required.