search

Home  >  Q&A  >  body text

javascript - Small problems encountered when using the html-webpack-plugin plug-in in Vue.

The index.html file of vue will contain a mounted node, which is <p id='app'> </p>, but if I use html -webpack-plugin, the generated html file does not contain the <p id='app'> </p> mount point, see I haven't found a solution in the plug-in's documentation. How should I do it?

怪我咯怪我咯2846 days ago530

reply all(3)I'll reply

  • 黄舟

    黄舟2017-05-19 10:25:27

    html-webpack-plugin has a template属性,可以指定一个你自己需要的html template, the usage is as follows:

    new HtmlWebpackPlugin({
        filename: 'index.html',
        inject: 'body',
        template: 'index.html_vm'
    })

    Then this index.html_vm can look like this:

    <!DOCTYPE html>
    <html lang="en">
    <head>
        <meta charset="UTF-8">
        <title>demo</title>
    </head>
    <body>
        <p id="app"></p>
    </body>
    </html>

    reply
    0
  • 为情所困

    为情所困2017-05-19 10:25:27

    You need to hang it on the original index.html bar. Webpack is not specifically used for vue. htmlWebpackPlugin only helps you process index.html and hang the packaged script. The dom structure inside will not be automatically generated for you. of.

    reply
    0
  • 伊谢尔伦

    伊谢尔伦2017-05-19 10:25:27

    The mount node is replaced instead of appended to the content

    reply
    0
  • Cancelreply