Does not resolve url in css only on Linux host

[cdpark0530]

Before beginning, my Linux host is a docker container of image node:latest to be exact

Current behaviour 💣

On Windows host, it resolves url in css files. On Linux host, it does not resolve url in css files.

Expected behaviour ☀️

On Linux host, it resolves url in css files as it does on Windows host.

or

as resolve.alias value (which is commented) of webpack.config.ts in this project: https://github.com/cdpark0530/tsconfig-paths-webpack-plugin-issue.git

Reproduction Example 👾

I made a backbone example on my github: https://github.com/cdpark0530/tsconfig-paths-webpack-plugin-issue.git

Environment 🖥

Windows

node: v14.15.3
npm: v7.21.1

Linux container

linux: 5.4.72-microsoft-standard-WSL2
node: v17.6.0
npm: v8.5.1

dependencies

{
  "@types/mini-css-extract-plugin": "^1.4.3",
  "@types/node": "^15.6.1",
  "@types/webpack": "^5.28.0",
  "css-loader": "^5.2.6",
  "html-webpack-plugin": "^5.3.1",
  "mini-css-extract-plugin": "^1.6.0",
  "resolve-url-loader": "^4.0.0",
  "sass": "^1.34.0",
  "sass-loader": "^11.1.1",
  "ts-loader": "^9.2.5",
  "ts-node": "^10.2.1",
  "tsconfig-paths-webpack-plugin": "^3.5.1",
  "typescript": "^4.4.2",
  "webpack": "^5.51.1",
  "webpack-cli": "^4.8.0"
}

[cdpark0530]

I found that function getPathsToTry in node_modules/tsconfig-paths/lib/try-path.js didn't resolve the image module url("/images/pages/search/example.png"). I close this issue as it's nothing to do with this plugin.

It was because it starts with / which is Linux path separator. It can resolve the image module even on Linux when I commented the part like below.

var path = require("path");
...
function getPathsToTry(extensions, absolutePathMappings, requestedModule) {
  if (!absolutePathMappings ||
    !requestedModule ||
    requestedModule[0] === "." /* ||
    requestedModule[0] === path.sep */) {
    return undefined;
  }
  ...
}

I tracked down functions below as well, and I found nothing that makes the different resolution on Windows and Linux. In node_modules/tsconfig-paths-webpack-plugin/lib/plugin.js

• constructor
• apply
• createPluginCallback, the returned function of it, and the callback passed to matchPath in createPluginCallback

In node_modules/tsconfig-paths/lib/match-path-async.js

• createMatchPathAsync
• matchFromAbsolutePathsAsync