"createAsyncMiddleware is not a function"

[jnaviask]

Hi all, I followed the DAPP tutorial and set up my wallet as such, using @walletconnect/[email protected]:

//  Create WalletConnect Provider
this._provider = new WalletConnectProvider({
  infuraId: INFURA_KEY
});

//  Enable session (triggers QR Code modal)
await this._provider.enable();

However, the WalletConnectProvider constructor throws the following error:

Uncaught (in promise) TypeError: createAsyncMiddleware is not a function
    at toAsyncRpcMiddleware (index.js?048e:199)
    at toFilterCreationMiddleware (index.js?048e:190)
    at createEthFilterMiddleware (index.js?048e:22)
    at createSubscriptionMiddleware (subscriptionManager.js?2ea2:14)
    at SubscriptionsSubprovider.eval [as _constructorFn] (subscriptions.js?4ca4:7)
    at SubscriptionsSubprovider.setEngine (json-rpc-engine-middleware.js?d2bc:18)
    at WalletConnectProvider.Web3ProviderEngine.addProvider (index.js?b439:103)
    ....

It seems related to json-rpc-engine versioning being inconsistent (particularly when used by eth-json-rpc-middleware vs the other dependencies) as a result of web3-provider-engine's dependencies. I see that there is already an issue to remove web3-provider-engine (#310), but I was wondering if there's a quick fix to solve this for the time being.

Downgrading to @walletconnect/[email protected], which uses [email protected] instead of 16.0.1 did not fix this problem. I can make a separate ticket in the web3-provider-engine if you think that might be a better location for this. Thanks!

[jnaviask]

Issue was in our webpack config, resolving the wrong version.