javascript - 为什么 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

一切正常。

但是，如果我们从顶级目录执行，则如下:

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，它会按预期工作。