Cannot use Loading React App Bridge action

Shopify Apps
1

Hi!

I try to use the Loading action in my React app: https://shopify.dev/docs/api/app-bridge/previous-versions/actions/loading#react

I import the Loading action this way:

import { Loading } from '@shopify/app-bridge-react';

The compiler returns the following error:

[ERROR] No matching export in "node_modules/@shopify/app-bridge-react/dist/index.js" for import "Loading"

Here are my dependencies:

"@shopify/app-bridge": "^3.7.8",
"@shopify/app-bridge-react": "^4.1.3",
"@shopify/app-bridge-utils": "^3.5.1",
"@shopify/polaris": "^12.10.0",

Is anyone facing the same problem?

2

This is because you’re on AppBridge v4. Downgrade to v3^

3

I wish I could but since march, 29th we have to load the latest app bridge version to be listed on the app store: https://shopify.dev/changelog/new-shopify-app-store-apps-require-the-latest-app-bridge

4

If you’re not using AppBridge CDN, you’re on AppBridge v3. If you’re on CDN and got app-bridge-react v4 (which is meant as a supplementary tool and not required), which is correct, then you can use window?.shopify?.loading(BOOL) to enable/disable the loading.

If you’re not using AppBridge CDN, you’re on the older version of AppBridge, which comes from npm packages and is v3. If that’s the case, downgrade your npm package from v4 to v3 and that’ll give you your working import.