I'm building an HTML web application and writing all my code in TypeScript. I use webpack to convert the TypeScript to JavaScript and to bundle and minify all my individual source files into one javaScript main.js file.
I'd like to know if the main.js file that I'm running in the browser was generated from a development build using webpack or a production build. How can I do this?
For example, in the webpack development config I do:
new webpack.DefinePlugin( {
IS_DEBUG_MODE: JSON.stringify( true ),
} ),
How can the compiled main.js file use this information to:
console.log( 'isDebugMode', ?? );
I tried doing process.env.IS_DEBUG_MODE but the browser gives me an error stating that process is not defined.
Figured out that I can use the html-webpack-plugin with template parameters to pass information from webpack into html.
https://github.com/jantimon/html-webpack-plugin/tree/main/examples/template-parameters