Script is not inlined when output folder is not top level
asevich opened this issue · 3 comments
asevich commented
Hi!
Script is not being inlined if HtmlWebpackPlugin filename
is set with extra folder, i.e. ./frontend/ui.html
instead of ui.html
Environment and package version
Webpack 5.88.2, HTML webpack plugin 5.5.3 , HTML inline script plugin 3.2.0
Reproduction link / code sample
webpack.config.js
const HtmlInlineScriptPlugin = require("html-inline-script-webpack-plugin");
const HtmlWebpackPlugin = require("html-webpack-plugin");
const path = require("path");
module.exports = (env, argv) => ({
entry: "./src/ui.ts",
module: {
rules: [
{
test: /\.ts?$/,
use: "ts-loader",
exclude: /node_modules/,
},
],
},
resolve: { extensions: [".tsx", ".ts", ".jsx", ".js"] },
output: {
filename: "[name].[contenthash].js",
path: path.resolve(__dirname, "dist"),
},
plugins: [
new HtmlWebpackPlugin({
inject: "body",
template: "./src/ui.html",
filename: "./frontend/ui.html",
}),
new HtmlInlineScriptPlugin(),
],
});
package.json
{
"name": "inline-script-bug",
"scripts": {
"build": "webpack --mode=development"
},
"devDependencies": {
"html-inline-script-webpack-plugin": "^3.1.0",
"html-webpack-plugin": "^5.3.2",
"ts-loader": "^9.2.5",
"typescript": "^4.3.5",
"webpack": "^5.82.0",
"webpack-cli": "^5.1.1"
}
}
src/ui.html
<html>
<head></head>
<body>
<textarea>some text</textarea>
</body>
</html>
src/ui.ts
console.log("test");
Steps to reproduce
In webpack.config.js
instead of supplying filename: "ui.html"
as an output filename, use filename: "./frontend/ui.html"
What is expected?
Javascript is inlined in dist/frontend/ui.html
What is actually happening?
Javascript is not inlined in dist/frontend/ui.html
and dist/frontend/main.[hash].js
file is generated