Что может привести к тому, что webpack5 сопоставит URL-адреса @font-face с абсолютным путем ⇐ CSS

[Anonymous]

Контекст — это расширение vscode, которое генерирует и обслуживает страницы и вспомогательные ресурсы в браузере. Он объединяет KATEX и обслуживает CSS и поддерживающие шрифты.
Шрифты попадают в пакет, в этом нет проблем, но по какой-то причине, которую я не могу понять, веб-пакет разрешает абсолютные пути и использует их в комплекте CSS.
ОК, вот весь файл webpack.config.js, обратите внимание, что для параметра output.publicPath уже установлено значение "./" так что это не так.
//@ts-check

'use strict';

const path = require('path');

//@ts-check
/** @typedef {import('webpack').Configuration} WebpackConfig **/

/** @type WebpackConfig */
const extensionConfig = {
target: 'node', // VS Code extensions run in a Node.js-context -> https://webpack.js.org/configuration/node/
mode: 'none', // this leaves the source code as close as possible to the original (when packaging we set this to 'production')

entry: './src/extension.ts', // the entry point of this extension, -> https://webpack.js.org/configuration/entry-context/
output: {
// the bundle is stored in the 'dist' folder (check package.json), -> https://webpack.js.org/configuration/output/
path: path.resolve(__dirname, 'dist'),
publicPath: "./",
filename: 'extension.js',
libraryTarget: 'commonjs2'
},
externals: {
vscode: 'commonjs vscode' // the vscode-module is created on-the-fly and must be excluded. Add other modules that cannot be webpack'ed, -> https://webpack.js.org/configuration/externals/
// modules added here also need to be added in the .vscodeignore file
},
resolve: {
// support reading TypeScript and JavaScript files, -> https://github.com/TypeStrong/ts-loader
extensions: ['.ts', '.js', ".mjs"],
alias: {
// Assuming 'styles' is the directory you want to resolve to
'highlight.js/styles': path.resolve(__dirname, 'node_modules/highlight.js/styles')
}
},
module: {
rules: [
{
test: /\.ts$/,
exclude: /node_modules/,
use: [
{
loader: 'ts-loader'
}
]
},
{
test: /\.(woff(2)?|ttf|eot|otf)(\?v=\d+\.\d+\.\d+)?$/i,
type: 'asset/resource',
use: {
loader: "url-loader"
},
generator: {
filename: 'fonts/[name][ext]'
}
},
{
test: /\.css$/,
use: [
'css-loader'
]
},
{
test: /\.html$/,
use: [
'raw-loader'
]
},
{
test: /\.node$/,
use: 'node-loader'
}]
},
devtool: 'nosources-source-map',
infrastructureLogging: {
level: "log", // enables logging required for problem matchers
},
};
module.exports = [extensionConfig];

Это структура пакета npm katex.


Это начало таблицы стилей, предоставленной пакетом npm katex.
< h3>katex.css
/* stylelint-disable font-family-no-missing-generic-family-keyword */
@font-face {
font-family: 'KaTeX_AMS';
src: url(fonts/KaTeX_AMS-Regular.woff2) format('woff2'), url(fonts/KaTeX_AMS-Regular.woff) format('woff'), url(fonts/KaTeX_AMS-Regular.ttf) format('truetype');
font-weight: normal;
font-style: normal;
}

и это то, что веб-пакет помещает в папку dist


но это то, что я получаю, получая katex.css из пакета во время выполнения.< /p>
/* stylelint-disable font-family-no-missing-generic-family-keyword */
@font-face {
font-family: 'KaTeX_AMS';
src: url(file:///d:/html-renderer-markdown/dist/fonts/KaTeX_AMS-Regular.woff2) format('woff2'), url(file:///d:/html-renderer-markdown/dist/fonts/KaTeX_AMS-Regular.woff) format('woff'), url(file:///d:/html-renderer-markdown/dist/fonts/KaTeX_AMS-Regular.ttf) format('truetype');
font-weight: normal;
font-style: normal;
}
@font-face {
font-family: 'KaTeX_Caligraphic';
src: url(fi…

Я не понимаю, почему вебпак так переписывает URL-адреса. Я ожидал, что будет использоваться publicPath. Мы ценим ваше руководство.
Переписывание правила CSS остановило это, но я не понимаю, зачем это было необходимо.


Подробнее здесь: https://stackoverflow.com/questions/786 ... olute-path