Build HTML in webpack in dev mode with html-webpack-plugin

4
votes

I'm trying to build separate HTML files using an index.ejs using html-webpack-plugin.

My index.ejs has the following block of code.

<% if (process.env.NODE_ENV === 'production') { %>

<script type="text/javascript" src="https://cdnjs.cloudflare.com/ajax/libs/react/15.2.1/react.min.js"></script>
<script type="text/javascript" src="https://cdnjs.cloudflare.com/ajax/libs/react/15.2.1/react-dom.js"></script>

<% } %>

I only want to load these scripts in production.

In my webpack file I'm loading HtmlWebpackPlugin to specify the location of the ejs template.

plugins: [
  new HtmlWebpackPlugin({
    template: 'index.ejs'
  }),

...

When I run webpack in production mode, with --env.prod, it properly builds the file into my public directory. But when I run with --env.dev, this plugin does not run.

How can I run HtmlWebpackPlugin in development mode to build an HTML file specific to my dev environment?

1
node.jswebpackejshtml-webpack-plugin
im playing with webpack but have the opposite problem. when I run NODE_ENV=production webpack it doesn't create index.html... Sorry if this aint much help.. - dublx
This sounds like a an issue with your webpack configuration. If you post a question I can try and help. - Himmel
Does the HTML file not generated at all ? If so can you provide the complete webpack configuration ? - lorefnon

1 Answers

-2
votes

You can use ejs-render-loader package.