Home > Software engineering >  Link a static JS file with HtmlWebpackPlugin
Link a static JS file with HtmlWebpackPlugin

Time:10-15

I am building an application with a custom webpack configuration.

I have integrated the HtmlWebpackPlugin with a custom index.html like so:

<!DOCTYPE html>
<html lang="en">
  <head>
    <meta charset="UTF-8" />
    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
    <title>Text Mining</title>
    <link rel="icon" type="image/x-icon" href="favicon.ico" />
    <link rel="preconnect" href="https://fonts.gstatic.com" />
    <link
      href="https://fonts.googleapis.com/css2?family=Montserrat:wght@500;600;700&display=swap"
      rel="stylesheet"
    />
  </head>
  <body>
    <div id="app"></div>
  </body>
</html>
      new HtmlWebpackPlugin({
        inject: true,
        filename: './index.html',
        template: './public/index.html',
        favicon: './public/favicon.ico',
        scripts: ['./public/static/js/env.js']
      }),

I assumed that adding the path to my static js file in the scripts array would copy env.js into the compiled html but I cannot see it.

Is there another plugin i need to copy from the public folder or am i missing something else?

CodePudding user response:

I am not sure if this is a good solution, but I have recently used copy-webpack-plugin to solve a similar issue. Maybe this will help you.

  • Related