resolve.extensions 在 Webpack 中有什么作用? [英] What does resolve.extensions do in Webpack?

问题描述

这是关于resolve.extensions的官方文档

Here is the official document about resolve.extensions

resolve.extensions

应用于解析模块的扩展数组.例如，为了发现 CoffeeScript 文件，您的数组应包含字符串.coffee".

An array of extensions that should be used to resolve modules. For example, in order to discover CoffeeScript files, your array should contain the string ".coffee".

默认:["", ".webpack.js", ".web.js", ".js"]

Default: ["", ".webpack.js", ".web.js", ".js"]

重要提示:设置此选项将覆盖默认值，这意味着 webpack 将不再尝试使用默认扩展名解析模块.如果您希望正确解析扩展名所需的模块(例如 require('./somefile.ext'))，则必须在数组中包含一个空字符串.类似地，如果您希望将不需要扩展名(例如 require('underscore'))的模块解析为带有.js"扩展名的文件，则必须在数组中包含.js".

IMPORTANT: Setting this option will override the default, meaning that webpack will no longer try to resolve modules using the default extensions. If you want modules that were required with their extension (e.g. require('./somefile.ext')) to be properly resolved, you must include an empty string in your array. Similarly, if you want modules that were required without extensions (e.g. require('underscore')) to be resolved to files with ".js" extensions, you must include ".js" in your array.

我完全被这个弄糊涂了.

I am totally confused by this.

如果您希望正确解析扩展名所需的模块(例如 require('./somefile.ext'))，您必须在数组中包含一个空字符串."

"If you want modules that were required with their extension (e.g. require('./somefile.ext')) to be properly resolved, you must include an empty string in your array."

为什么?

同样，如果您希望将不需要扩展名的模块(例如 require('underscore'))解析为带有.js"扩展名的文件，则必须在数组中包含.js"."

"Similarly, if you want modules that were required without extensions (e.g. require('underscore')) to be resolved to files with ".js" extensions, you must include ".js" in your array."

为什么?如果我在数组中包含.js"和.css"会怎样.

我不清楚resolve.extension的行为.请举例说明.

I am not clear about the behavior of resolve.extension. Please explain with example.

推荐答案

Webpack 使用 resolve.extensions 生成模块的所有可能路径，例如

Webpack uses resolve.extensions to generate all the possible paths to the module, e.g.

function getPaths(module) {
    return ['', '.js', '.css'].map(ext => module + ext);
}

getPaths('./somefile'); // ['./somefile', './somefile.js', './somefile.css']

getPaths('./somefile.js'); // ['./somefile.js', './somefile.js.js', './somefile.js.css']

Webpack 会继续查找每个路径，直到找到一个文件.

Webpack would then proceed to lookup each of those paths until it finds a file.

这篇关于resolve.extensions 在 Webpack 中有什么作用?的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！