path.resolve()的用法

前言

在webpack的使用中，都会遇到配置output的情况，在path中有这么一段配置：

const path = require('path')
module.exports = {
  ...
  output: {
    filename: './js/[name][contenthash].js',
    path: path.resolve(__dirname, 'dist')
  }
}

其中有一段path.resolve(__dirname, ‘dist’)一直没明白是什么意思，关键是不知道resolve的作用是什么，官方给出的解释如下：

官方给的解释比较隐晦，看完后还是不太清楚，故尝试带入不同的参数查看结果，过程如下：

resolve的用法

我们先来看一下带入不同参数给出的结果，代码中文件所在目录为：
F:\Workspaces\webpack\src
__dirname为node自带参数，返回的是当前文件所在目录

// path.js
path.resolve()
// 输出结果：F:\Workspaces\webpack
path.resolve('/dist')
// 输出结果：F:\dist
path.resolve('dist')
// 输出结果：F:\Workspaces\webpack\dist
path.resolve('./dist')
// 输出结果：F:\Workspaces\webpack\dist
path.resolve(__dirname, '/dist')
// 输出结果：F:\dist
path.resolve(__dirname, './dist')
path.resolve(__dirname, 'dist')
// 输出结果：F:\Workspaces\webpack\src\dist
path.resolve(__dirname, 'dist', 'js')
// 输出结果：F:\Workspaces\webpack\src\dist\js

通过上面的测试，我们不难看出，path.resolve()默认输出的是当前项目的根目录（工作路径），path.resolve()将入参从后往前拼接为一个绝对路径，如果我们在靠后的参数给到一个绝对路径，那么就会忽略前方的参数。
按照正常的用法，我们应该在第一个参数给到一个绝对路径，然后后面的参数用相对路径拼接。