search

Hey-Mantle / polaris

Drop-in Polaris components for integrating your Shopify app billing UI with Mantle
MIT License
1 stars 0 forks source link

`ReferenceError: process is not defined` when using MantleProvider #1

Closed martinlatrille closed 4 months ago

martinlatrille commented 4 months ago

I get this error when trying to use the MantleProvider in my Shopify / Remix application:

ReferenceError: process is not defined
    at LocalizedApp (https://garlic-heath-usda-cas.trycloudflare.com/app/routes/app.tsx:25:23)
    at renderWithHooks (https://garlic-heath-usda-cas.trycloudflare.com/node_modules/.vite/deps/chunk-GZD7INZN.js?v=b548b456:11548:26)
    at mountIndeterminateComponent (https://garlic-heath-usda-cas.trycloudflare.com/node_modules/.vite/deps/chunk-GZD7INZN.js?v=b548b456:14926:21)
    at beginWork (https://garlic-heath-usda-cas.trycloudflare.com/node_modules/.vite/deps/chunk-GZD7INZN.js?v=b548b456:15914:22)
    at beginWork$1 (https://garlic-heath-usda-cas.trycloudflare.com/node_modules/.vite/deps/chunk-GZD7INZN.js?v=b548b456:19753:22)
    at performUnitOfWork (https://garlic-heath-usda-cas.trycloudflare.com/node_modules/.vite/deps/chunk-GZD7INZN.js?v=b548b456:19198:20)
    at workLoopSync (https://garlic-heath-usda-cas.trycloudflare.com/node_modules/.vite/deps/chunk-GZD7INZN.js?v=b548b456:19137:13)
    at renderRootSync (https://garlic-heath-usda-cas.trycloudflare.com/node_modules/.vite/deps/chunk-GZD7INZN.js?v=b548b456:19116:15)
    at recoverFromConcurrentError (https://garlic-heath-usda-cas.trycloudflare.com/node_modules/.vite/deps/chunk-GZD7INZN.js?v=b548b456:18736:28)
    at performConcurrentWorkOnRoot (https://garlic-heath-usda-cas.trycloudflare.com/node_modules/.vite/deps/chunk-GZD7INZN.js?v=b548b456:18684:30)

here is the return of my app component:

return (
        <AppProvider
            apiKey={apiKey}
            i18n={i18n.getTranslationTree("Polaris") as TranslationDictionary}
            isEmbeddedApp
        >
            <NavMenu>
              ...
            </NavMenu>
            <MantleProvider
                appId=XXX // hardcoded
                customerApiToken=XXX // hardcoded
                apiUrl=XXX // hardcoded
            >
                <Outlet />
            </MantleProvider>
        </AppProvider>
    )

This error disappears when I comment the MantleProvider, and comes back when I uncomment. Please let me know your thoughts! Thank you!

martinlatrille commented 4 months ago

I was using process.env above in my component to retrieve Mantle credentials, which was the cause of the error. Surprisingly, this was not throwing an error when MantleProvider was commented out!