Create React App removes SSI directives on Build from index.html

[ngyangjo]

I'm trying to add some SSI directives in the index.html so that I can return dynamic meta tags based on the current url. I'm doing this to solve the Facebook Meta Tag issue. Below is the snippet of the if-condition I've added in the index.html.

<!--#if expr="$DOCUMENT_URI = /movie-review\/(.*)/" -->

But, realized that the create-react-app seems to delete them on build. The final built index.html is minified and does not have any comments on them. Since SSI directives syntax is similar to html comments, create-react-app is removing them. Is there any way to skip removing them on build? If no, then what other possible solutions exist to solve the dynamic meta tag problem for react app served on apache server?

[Azayzel]

There is, you'll need to edit your webpack.config.prod.js from within react-scripts npm package. Just set removeComments to false.

[ngyangjo]

Is it possible to do it outside the node-modules? I mean by not manually modifying the react-scripts code but by changing some configuration in the app. I'd like to do it in the app and not depend upon modifying the module's code.

[Azayzel]

I’m not sure if you can pass args to the build process or not. That would be super nice though. I think currently the recommendation is to eject and modify the webpack config files.