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.

Sign up for GitHub

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

Jump to bottom

What if I need to build HTML content using the chunks data? #625

Closed
VictorQueiroz opened this issue Mar 27, 2017 · 7 comments
Closed

What if I need to build HTML content using the chunks data? #625

VictorQueiroz opened this issue Mar 27, 2017 · 7 comments

Comments

@VictorQueiroz
Copy link

VictorQueiroz commented Mar 27, 2017 •
edited
Loading

What if I don't want html-webpack-plugin to generate the HTML for me? Would be great if we have an option like:

new HtmlWebpackPlugin({
    output: (chunksData) => {
        fs.writeFileSync('./public/index.html', nunjucks.renderString(template, chunksData));
    }
})
@mastilver
Copy link
Collaborator

After some research, there is two nunjucks loaders:

The first one doesn't return a function, it returns a obj with the method render on it
The second doesn't take parameters

The best way for html-webpack-plugin to handle nunjucks is to ask the author of https://www.npmjs.com/package/nunjucks-loader to return a function rather than an object

Overwise you have many other engines available: https://github.com/jantimon/html-webpack-plugin/blob/master/docs/template-option.md

@mastilver
Copy link
Collaborator

Just noticed there is already an open issue related to that: at0g/nunjucks-loader#35

@VictorQueiroz
Copy link
Author

Thank you for your answer. But the point is to handle it without having to depent of any template options. I mean in my case I need to add css file path that is not generated using Webpack, so it's not a part of entry point and would be great if that option is allowed by the module.

@mastilver
Copy link
Collaborator

mastilver commented Mar 27, 2017 •
edited
Loading

Oh, I see, I misunderstood you.

So to be clear, you want in the same html file you want:

  • static css (almost never change)
  • generated assets from webpack

I'm afraid you will have to use a template

Here's a template you could use:

<!DOCTYPE html>
<html>
    <head>
        <title>My app</title>
        <meta charset="UTF-8">
        <link href="my-static-style.css" rel="stylesheet">
    </head>
    <body>
    </body>
</html>

The rest of your css will be added in the head alongside your static css
Your javascript will be placed in the body

@mastilver
Copy link
Collaborator

You could also use https://github.com/SimenB/add-asset-html-webpack-plugin or https://github.com/jharris4/html-webpack-include-assets-plugin

@aendra-rininsland
Copy link

Anyone needing to use Nunjucks with html-webpack-plugin, I've managed to do so with the instructions here: at0g/nunjucks-loader#35 (comment)

@lock
Copy link

lock bot commented May 31, 2018

This issue has been automatically locked since there has not been any recent activity after it was closed. Please open a new issue for related bugs.

@lock lock bot locked as resolved and limited conversation to collaborators May 31, 2018
Sign up for free to subscribe to this conversation on GitHub. Already have an account? Sign in.
Assignees
No one assigned
Labels
None yet
Projects
None yet
Milestone
No milestone
Development

No branches or pull requests
3 participants
@aendra-rininsland @mastilver @VictorQueiroz