Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

HtmlWebpackPLugin ignores Rule.generator.publicPath value #1723

Open
simple-russia opened this issue Jan 29, 2022 · 2 comments
Open

HtmlWebpackPLugin ignores Rule.generator.publicPath value #1723

simple-russia opened this issue Jan 29, 2022 · 2 comments

Comments

@simple-russia
Copy link

simple-russia commented Jan 29, 2022

Current behaviour 💣

I have a CSS asset main.css , 2 js assets vendor.js and index.js that my HtmlWebpakPlugin injets into html document. I have to enter the speific publicPath . It works via webpack's output.publicPath or as an option inside new HtmlWebpackPlugin(options). All works great but the thing is, i have to import one of the JS files from another public path. So, suppose i have to import main.css and main.js from https://cdn-1.com/assets and vendor.js from https://cdn-2.com/assets. To ahieve this, i decided to use Rule.generator.publichPath which can give specifi publicPath to assets that satisfy the test: regex condition. So this is my webpack config:

webpack.config.js

modules.exports = {
    output: {
        ....
        publicPath: "https://cdn.mysite.com/",
    }
    ...
    module: {
        rules: [
        { // first rule
            test: /(main\.css|index\.js)$/,
            generator: {
                publicPath: "https://cdn-1.com/assets",
            }
        },
        { // second rule
            test: /vendor\.js$/,
            generator: {
                publicPath: "https://cdn-2.com/assets",
            }
        },
        ]
    }
    ...
     plugins: [  
       new HtmlWebpackPlugin({  
         template: 'public/index.html',  
         minify: true, // minify HTML 
       }), 
   ], 
}

Html plugin totally ignores Rule.generator.publicPath variable and works only with output.publicPath (whether even if i have it or not, it still ignores Rule.generator.publicPath, even if i use public path inside HtmlWebpackPlugins options.

Expected behaviour ☀️

I would like that Rule.generator.publicPath is taken in account Rule.generator.publicPath when rendering an html document so all the and <script> elements have their src/href attributes exactly what i put inside Rule.generator.publicPath which adds more flexibility as to where to serve my assets from. I am not sure there are any ways to add specific public path to some certain assets using html document renderer of this plugin.

Reproduction Example 👾

webpack.config.js

modules.exports = {
    output: {
        ....
        publicPath: "https://cdn.mysite.com/",
    }
    ...
    module: {
        rules: [
        { // first rule
            test: /(main\.css|index\.js)$/,
            generator: {
                publicPath: "https://cdn-1.com/assets",
            }
        },
        { // second rule
            test: /vendor\.js$/,
            generator: {
                publicPath: "https://cdn-2.com/assets",
            }
        },
        ]
    }
    ...
     plugins: [  
       new HtmlWebpackPlugin({  
         template: 'public/index.html',  
         minify: true, // minify HTML 
       }), 
   ], 
}

Environment 🖥

Node.js v14.17.3
win32 10.0.19042
npm version 6.14.13
[email protected]
[email protected]

@jantimon
Copy link
Owner

you are absolutely right

that sounds like a useful feature

could you please create a PR for it?

@simple-russia
Copy link
Author

I am sorry, i am new to github and i don't know what to do. If it's about a Pull Request, i don't know how to code this feature

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

No branches or pull requests

2 participants