为什么webpack配置必须使用path.resolve和path.join

Question

在webpack配置中常见的是,当我们需要设置路径path.resolve或path.join经常使用时,我只想弄清楚为什么我们必须使用它们而不是普通的字符串路径,例如'../dist'

我部分理解可能出于某种目的,它们用于返回绝对路径,但我认为普通的字符串路径也能够起作用.

例如

output: {
filename: '[name].js',
path: path.resolve(__dirname, '../dist'),
chunkFilename: 'js/[name].[chunkhash].js'
}

Answer 1

这与webpack无关,只与Node.js处理路径的方式有关.路径不是相对于文件路径解析的,而是默认相对于工作目录.假设我们有以下目录结构:

project
 ??? a
 |   ??? 1.js
 ??? b
     ??? 2.txt

1.js包含以下内容:

const filePath = '../b/2.txt';
const content = require('fs').readFileSync(filePath);
console.log(content.toString());

那么,如果我们跑了

cd a
node 1.js

一切正常.

但是,如果我们从toplevel目录执行,则执行以下操作:

node a/1.js

我们收到一个错误:

Error: ENOENT: no such file or directory, open 'C:\Users\baryl\Desktop\b\2.txt'

因为路径现在相对于project而不是相对于project/a.path.resolve解决了这个问题.

const path = require('path');
const filePath = path.resolve(__dirname, '../b/2.txt');
const content = require('fs').readFileSync(filePath);
console.log(content.toString());

现在我们可以安全地node a/1.js从项目目录执行,它将按预期工作.