Can't build the @shopify/shopify-api on Vite and Parcel

[sorcamarian]

Issue summary

I tried to build a simple example where the Shopify API calls the "shop.myshopify.com/admin/api/2022-01/customers.json" endpoint. I wanted to see where they put the API Key when making the HTTP Request so I can use a code on the Front End and POST a new customer.

The code that I use:

import Shopify from '@shopify/shopify-api';

const client = new Shopify.Clients.Rest('https://SHOP.myshopify.com/', "API KEY");

const data = await client.get({
  path: 'customers',
});
console.log(data);

In both Vite and Parcel builders I get an error.

Error in Vite: Uncaught TypeError: Cannot read properties of undefined (reading 'from') at node_modules/safe-buffer/index.js (@shopify_shopify-api.js:1892:17) at __require2 (@shopify_shopify-api.js:19:50) at node_modules/jws/lib/sign-stream.js (@shopify_shopify-api.js:2448:19) at __require2 (@shopify_shopify-api.js:19:50) at node_modules/jws/index.js (@shopify_shopify-api.js:2628:22) at __require2 (@shopify_shopify-api.js:19:50) at node_modules/jsonwebtoken/decode.js (@shopify_shopify-api.js:2661:15) at __require2 (@shopify_shopify-api.js:19:50) at node_modules/jsonwebtoken/index.js (@shopify_shopify-api.js:4719:15) at __require2 (@shopify_shopify-api.js:19:50)

Errors in Parcel

@parcel/core: Failed to resolve 'buffer' from './node_modules/@shopify/shopify-api/dist/utils/safe-compare.js'
/Users/mariansorca/Documents/2022/January/Quick turn on Custom CSS for Shopify/theme_export__bay-area-skin-care-company-myshopify-com-dawn__26JAN2022-1257pm/node/parcel-builder/node_modules/@shopify/shopify-api/dist/utils/safe-compare.js:17:21
  16 |         if (typeof strA === 'object' && typeof strB === 'object') {
> 17 |             buffA = Buffer.from(JSON.stringify(strA));
>    |                     ^^^^^^
  18 |             buffB = Buffer.from(JSON.stringify(strB));
  19 | 

I'm using Node v16.13.0

[sorcamarian]

Is it because it is only built for the back end?

[KingGilbert89]

I have the same error. Have you been able to find a solution in the meantime?

[sorcamarian]

I think it’s because the code is only for the backend

[leandrorlemos]

I was facing the same problem with the next build. It was due to the context.ts code checking params, which in my case provided by env vars and not present at build time.

https://github.com/Shopify/shopify-api-node/blob/main/src/context.ts#L60

[sorcamarian]

I think it’s because that code is for the backend only.

On Mon, 30 May 2022 at 12:34 PM, Ingo König @.***> wrote:

I have the same error. Have you been able to find a solution in the meantime?

— Reply to this email directly, view it on GitHub https://github.com/Shopify/shopify-node-api/issues/302#issuecomment-1140930810, or unsubscribe https://github.com/notifications/unsubscribe-auth/AC7OEOIATW7HA5IX6G3EWOLVMSDTTANCNFSM5OF4JFJA . You are receiving this because you authored the thread.Message ID: @.***>

[cquemin]

Yes it is indeed a library for javascript/typescript based backend. So you would need to use this library on a javascript/typescript backend and you would then call those endpoints and any other you add from your frontend. We have recently released v6 of this API with some easy integration with express and we have also made it easy to chose your own session storage with same ready to use example.