sagold / handlebars-webpack-plugin

Renders your html-template at build time
161 stars 45 forks source link

Update Documentation for HtmlWebpackPlugin partials #38

Closed alisonailea closed 4 years ago

alisonailea commented 6 years ago

Had to throw debuggers on the HandlebarsPlugin as a node_module to figure out how to access the htmlWebpackPlugin partials output.

What threw me was

  1. there is no documentation around what htmlWebpackPlugin.prefix is. (prefix founds like an extension)
  2. reading through PRs and issues it appeared as if htmlWebpackPlugin: true would be a valid setting but it is not.

Suggestions: change prefix to folderPrefix or partialPath or add documentation making it clear that this is the folder where you must tell HandlebarsPlugin to look for the new partial.

update compiler hook functions to set enabled: true when htmlWebpackPlugin: true

what the documentation says should work...

new HtmlWebpackPlugin({
    title: "Generic Head Title",
    // the template you want to use
    template: path.join(__dirname, "src", "generatedpartial", "head.hbs"),
    // the output file name
    filename: path.join(__dirname, "dist", "partials", "head.hbs"),
    inject: "head"
}),

new HandlebarsWebpackPlugin({

    htmlWebpackPlugin: {
        enabled: true, // register all partials from html-webpack-plugin, defaults to `false`
        prefix: "html" // default is "html"
    },

    entry: path.join(process.cwd(), "src", "hbs", "*.hbs"),
    output: path.join(process.cwd(), "dist", "[name].html"),

    partials: [
      path.join(process.cwd(), "dist", "*", "*.hbs"),
      path.join(process.cwd(), "src", "hbs", "*", "*.hbs")
    ]
})

what actually works...

{{> 'html/partials/head'}}
new HtmlWebpackPlugin({
    title: "Generic Head Title",
    // the template you want to use
    template: path.join(__dirname, "src", "generatedpartial", "head.hbs"),
    // the output file name
    filename: path.join(__dirname, "dist", "partials", "head.hbs"),
    inject: "head"
}),

new HandlebarsWebpackPlugin({

    htmlWebpackPlugin: {
        enabled: true, // register all partials from html-webpack-plugin, defaults to `false`
        prefix: "html" // default is "html" <-- This needs more documentation
    },

    entry: path.join(process.cwd(), "src", "hbs", "*.hbs"),
    output: path.join(process.cwd(), "dist", "[name].html"),

    partials: [
      "html/partials/*.hbs"
      path.join(process.cwd(), "src", "hbs", "*", "*.hbs")
    ]
})