webpack配置之---上下文
context
context
是 Webpack 配置中的一个重要属性,它主要用于确定模块解析时的基础目录。可以理解为是 Webpack 在解析模块时,基于哪个目录作为根路径来查找模块。context
的默认值是 process.cwd()
,即当前执行 Webpack 命令时的工作目录。
1. context
的作用
当你使用相对路径来引入模块时,Webpack 会从 context
指定的目录开始查找模块,而不是从项目根目录开始查找。
module.exports = {
context: path.resolve(__dirname, 'src'), // 设置模块解析的基础目录
entry: './index.js', // 入口文件路径相对于 context
};
在这个例子中,context
被设置为 'src'
,这意味着 Webpack 会从 src
目录开始查找相对路径模块。而如果不设置 context
,Webpack 会默认从当前工作目录(process.cwd()
)开始查找。
2. context
的默认值
context
的默认值是process.cwd()
,即你执行 Webpack 命令时的工作目录。- 这意味着,如果你没有显式设置
context
,Webpack 将默认从执行命令时的当前工作目录开始解析模块。
3. 使用场景
- 多入口的情况:如果你的项目有多个入口,并且入口文件的位置不在根目录下,可以使用
context
来减少路径书写的冗长。 - 指定基础路径:当你的项目的文件结构较深时,使用
context
可以确保路径的正确性,避免相对路径写得过长。
总结
context
用于设置 Webpack 解析模块时的基础路径。- 如果不设置
context
,默认值是process.cwd()
,即当前工作目录。 - 设置
context
后,所有的模块路径将相对于context
进行解析。