Javascript 如何与Shopify'一起发展；在本地主机上运行应用程序桥？

在React中初始化Shopify的AppBridge需要

apiKey

和

shopOrigin

。我获取数据并加载我的开发服务器，但遇到错误：

未能对“DOMWindow”执行“postMessage”：提供的目标源（“”）与收件人窗口的源（“”）不匹配

与

AppBridge

相关的内容在此状态下不起作用

我发现满足此错误的唯一方法是创建一个js构建，并通过我的

节点

服务器将其作为静态资产使用，然后通过Shopify admin访问应用程序。这样，指定的目标源将匹配收件人窗口的源，但我希望避免在每次前端更改后创建生成。是否有其他方法可以配置AppBridge或解决它，以便我可以继续在localhost上使用前端，在那里我可以利用webpack重新加载热模块

// app.component.tsx

import { AppProvider } from '@shopify/polaris';
import { Provider } from '@shopify/app-bridge-react';

const AppComponent: React.SFC<AppProps> = ({
}) => {
  const appBridgeConfig = {
    apiKey: process.env.API_KEY,
    shopOrigin: shopDomainName,
  };


  return (
    <AppProvider i18n={{}}>
      <Provider config={appBridgeConfig}>
        <Dashboard />
      </Provider>
    </AppProvider>
  );
};

//app.component.tsx
从'@shopify/polaris'导入{AppProvider}；
从'@shopify/app-bridge-react'导入{Provider}；
常量AppComponent:React.SFC

我可以使用
AppBridge
处理
Polaris
，但我现在遇到了与此人得出结论相同的问题。
如果您使用的是windows，您可以在C:\windows\System32\drivers\etc\hosts中将域名指向本地。

如文件末尾所示：

127.0.0.1   https://example-test-app.myshopify.com

我认为其他操作系统也可以为您提供类似的功能。
如果您在windows上，您可以将域名指向本地C:\windows\System32\drivers\etc\hosts

如文件末尾所示：

127.0.0.1   https://example-test-app.myshopify.com

我认为其他操作系统也可以为您提供类似的功能。
我在mac电脑上尝试了它，在
/etc/hosts
文件中添加了一个条目，将
127.0.0.1
映射到目标域，但它仍然给我同样的错误。我在mac电脑上尝试了它，在
/etc/hosts
文件中添加了一个条目，将
127.0.0.1
映射到目标域，但它仍然给了我相同的错误。