1 year ago

#387808

test-img

jerome

html-loader only works on index.html file

I'm working on a static site project, and have to now add multiple pages using the same header and footer. I'm trying to do this by turning the header.html and footer.html files into partials.

I've setup my webpack.config.js to use HtmlWebpackPlugin where the template is the index.html file.

plugins: [
        new HtmlWebpackPlugin({
            template: 'src/index.html'
        }),
    ]

I've also called the partials in the index.html file as follows:

<body>
    <%= require('html-loader!./partials/header.html').default %>
    
    
    <%= require('html-loader!./partials/home.html').default %>


    <%= require('html-loader!./partials/footer.html').default %>
</body>

This works on the index file. But now I've got to add a portfolio.html page and reuse the header and footer. When I call the partials the same way, they render as strings on the html page

enter image description here

Could someone help me with this? I don't know how to reuse the partials in other html pages.

html

webpack

partial

html-webpack-plugin

webpack-html-loader

0 Answers

Your Answer

Accepted video resources