CODEWITHSUNDEEP
reactjswebpackhtml-webpack-plugin
Mini
Mini

Reputation: 1170

how add reference files in HtmlWebpackPlugin

how and where should I add reference links to files such as css or js in HtmlWebpackPlugin?

here is my webpack config file:

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

and I want to add 

<html>
    <head>
        <!-- App Favicon -->
        <link rel="shortcut icon" href="%PUBLIC_URL%/assets/images/favicon.ico">

        <!-- Switchery css -->
        <link href="%PUBLIC_URL%/assets/plugins/switchery/switchery.min.css" rel="stylesheet" />

        <!-- Bootstrap CSS -->
        <link href="%PUBLIC_URL%/assets/css/bootstrap.min.css" rel="stylesheet" type="text/css" />
        <!-- Modernizr js -->
        <script src="%PUBLIC_URL%/assets/js/modernizr.min.js"></script>

    </head>

    <body class="fixed-left">
      <noscript>
        You need to enable JavaScript to run this app.
      </noscript>
      <div id="root"></div>
      <script>
          var resizefunc = [];
      </script>

      <!-- jQuery  -->
      <script src="%PUBLIC_URL%/assets/js/jquery.min.js"></script>
    </body>
</html>

before I had public folder and I added assets and by using %PUBLIC_URL% was able to add reference but after adding webpack I don't know how to do it

Upvotes: 2

Views: 2534

Answers (1)

Mini
Mini

Reputation: 1170

I found the solution there is another plug in to inject other references

https://www.npmjs.com/package/add-asset-html-webpack-plugin

Upvotes: 1

Related Questions