How to stop React from using favicon from _Layout.cshtml instead of webpack.config.js?

by

I have a React app with TypeScript, but it seems to be using _Layout.cshtml to display the favicon instead of webpack.config.js generating index.html.

_Layout.cshtml has this line:

<link rel="shortcut icon" type="image/png" href="~/dist/favicon.ico" />

webpack.config.js:

new HtmlWebpackPlugin({
   favicon: './ClientApp/content/favicon.ico'
}),

index.html:

<link rel="shortcut icon" href="/dist/favicon.ico">

I haven’t been able to find anything about how React decides to use webpack instead of the layout. Removing favicon from _Layout.cshtml just leaves it as a default icon instead of falling back on the one I’ve defined in webpack.

Is there something else I need to disable or change in order to force it to use the webpack version? The reason I want to do this is because I need to show two different favicons based on something that is set inside the React app.

119 thoughts on “How to stop React from using favicon from _Layout.cshtml instead of webpack.config.js?”

Leave a Comment