Webpack: How to inject javascript into the HTML instead of separate JS file

Question

Is there a way to have webpack inject the output into the HTML instead of a separate file?

<html>
  <head>
  </head>
  <body>
    <script type="text/javascript">
      // webpack puts the output here
    </script>
  </body>
</html>

Stephen Gilboy · Accepted Answer · 2018-10-17 01:27:05Z

4

I had to use the html-webpack-inline-source-plugin. https://github.com/DustinJackson/html-webpack-inline-source-plugin

plugins: [
  new HtmlWebpackPlugin({
    inlineSource: '.(js|css)$' // embed all javascript and css inline
  }),
  new HtmlWebpackInlineSourcePlugin()
]

answered Oct 17, 2018 at 1:27

Stephen Gilboy

5,8552 gold badges34 silver badges42 bronze badges

Sign up to request clarification or add additional context in comments.

4 Comments

Gustavo Vargas Over a year ago

Works! But with version 4.39 of webpack it was initially throwing an error. It was solved by using the beta version: [email protected] and using it with: new HtmlWebpackInlineSourcePlugin(HtmlWebpackPlugin).

Dr.Random Over a year ago

Does not work anymore

Stephen Gilboy Over a year ago

@Dr.Random which version of webpack, node and the plugins are you using?

Dr.Random Over a year ago

I installed all the latest a couple of days ago.

Collectives™ on Stack Overflow

Webpack: How to inject javascript into the HTML instead of separate JS file

1 Answer 1

4 Comments

Your Answer

Linked

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

4 Comments

Your Answer

Sign up or log in

Post as a guest

Linked

Related