Create-react-app: Conditional content in index.html

[iamandrewluca]

Hello! It is possible in index.html to include some content based on NODE_ENV ?
For example when I am in production I want to include Google Analytics, or other services scripts.
Thanks!

[gaearon]

I think we might accidentally support ejs there although it wasn’t really intentional 😛 Let me know if you can make it work somehow.

In general though I find it might be easier to set this up from JS by appending script tags.

[iamandrewluca]

@gaearon LOL, it works, great! Thanks!
added this in head tag

<% if (process.env.NODE_ENV === 'production') { %>
  <script>
    // my GA script
  </script>
<% } %>

[iamandrewluca]

I also wanted to include a partial, but it seems is not ejs
By default HtmlWebpackPlugin uses lodash template loader that does not support include
https://lodash.com/docs#template

By default (if you don't specify any loader in any way) a fallback lodash loader kicks in.

https://github.com/jantimon/html-webpack-plugin/blob/master/docs/template-option.md

[iamandrewluca]

My use case. I want to import inline svg for icons. Did this steps

• Eject CRA
• npm install ejs-compiled-loader
• Change HtmlWebpackPlugin to

new HtmlWebpackPlugin({
  inject: true,
  template: `!!ejs-compiled-loader!${paths.appHtml}`,
}),

• In public/index.html include any partials
  ```ejs
  <% include public/icons.svg %>
  ````
• Have public/icons.svg content in final index.html

Any chance to add this to CRA?
I can make a PR.
Thanks!
@gaearon

[littlepoolshark]

@iamandrewluca ,Has your suggestion been accepted?

[iamandrewluca]

Din't make any PR at that time, and was left behind.
Now I import SVG's in react using react-scripts@2.*

https://facebook.github.io/create-react-app/docs/adding-images-fonts-and-files#adding-svgs