How not to rewrite everything everytime :)
Recently I had a task - add cache busters in the existing React project.
It is pretty straightforward - open webpack config, add [contenthash(:number)] to output.filename, and that's it.
Give me a sec, I said, and open my IDE.
But that was not so easy because links to resulting js files were hardcoded to ejs templates. ExpressJS serve those templates because some variables should be inserted there on request time.
My first thought was to throw everything out and rewrite it with proper SSR. But that would take more time than I can afford on that task.
o what I need is to somehow add links to templates by Webpack. And HtmlWebpackPlugin, with the help of raw-loader, can do that.
First of all, make sure that HtmlWebpackPlugin and raw-loader are installed in the project.
Then we will tell HtmlWebpackPlugin to get our existing templates, add there links to assets, live rest as it is, and save as new templates for the ExpressJS server.
I hope it helps you next time you feel the urge to rewrite everything.