webpack5 use extract-loader to extract html file,but extract-loader always report error.

[jyp114110]

I use html-loader and extract-laoder to extract html file, but extractorLoder.js always report errors. My config is:
const pathToIndexHtml = require.resolve("./src/file.html"); const pathToMainJs = require.resolve("./src/index.js"); module.exports = { entry: [ pathToMainJs, pathToIndexHtml ], output: { assetModuleFilename: "[name][ext]", }, module: { rules: [ { test: pathToIndexHtml, type: "asset/resource", generator: { filename: "[name][ext]", }, }, { test: pathToIndexHtml, use: [ "extract-loader","html-loader"], }, ], }, };
And use Official website example also report same error. Error is:

Module build failed (from ./node_modules/extract-loader/lib/extractLoader.js):
SyntaxError: unknown: Unexpected token (3:62)
import 'HTML_LOADER_GET_SOURCE_FROM_IMPORT' from "../node_modules/html-loader/dist/runtime/getUrl.js";
var 'HTML_LOADER_IMPORT_0' = new URL("./images/nhlt.jpg", import.meta.url);

import can not been properly disposed

[shoaibsharif]

I am also facing the same issue. Did you find an workaround?

[GiantTreeLP]

Set esModule to false in both html-loader and css-loader

[Mario-Eis]

Set esModule to false in both html-loader and css-loader

With url(./whatever.woff) in the file, this raises another error