componentDidMount life cycle method is called twice in react

Viewed 169

In my react application, the initial API call is made twice when the application gets loaded. I looked at the Network tab in Chrome->inpsect, the 'initiator' call stack is showing that the first call is made from VM123000_bundle.js whereas the second call is just made from the actual bundle.js. The same code working in the prod environment except that the Webpack (1.x -> 4.x) and React (15.x->16.x) modules are upgraded. Could someone please point what is the VM123000_bundle.js and why it gets called the first time when the home page gets loaded?

AppHome.js

componentDidMount () {
const appdata = this.props.ebayHome.toJS();
this.props.getAccounts("/EName/Account/, ActionTypes.ACCOUNT_DATA, JSON.stringify(accountMutualParams));
}
1 Answers

It is an issue with HtmlWebpackPlugin which actually injects all the generated bundle references into the existing HTML page. There are two ways to fix it.

  1. skip injection in webpack config

  2. remove the bundle references in the HTML page

Related