Ad

Misleading And Outdated Shopify Buy JS Documentation

- 1 answer

I am currently trying to build a Wordpress site to sell products online, I am using Shopify to handle the ecommerce part. The problem relies on this piece of code.

import Client from 'shopify-buy';

const client = Client.buildClient({
  domain: 'your-shop-name.myshopify.com',
  storefrontAccessToken: 'your-storefront-access-token'
});

I am using the minified UMD build version posted on the documentation, my actual code is this :

const client = ShopifyBuy.buildClient({
  domain: 'domain.myshopify.com',
  storefrontAccessToken: 'token',
  apiKey: 'key',
  appId: '6'
});

// Fetch all products in your shop
client.product.fetchAll().then((products) => {
  // Do something with the products
  console.log(products);
});

I don't use the import because I am using the CDN resource (I enqueue it on my wordpress functions.php ), the declaration of the client in my code is different since for unknown reasons for me, whenever I try to only use the piece of code provided by the shopify documentation I receive error messages saying I am missing the apiKey and the appID so I needed to include them, to later receive this message from console :

[ShopifyBuy] Config property apiKey is deprecated as of v1.0, please use storefrontAccessToken instead.

and also receive this error :

"TypeError: client.product is undefined"

So this makes me believe that either the minified version provided is outdated or something is wrong with the information provided from shopify to the people that try to use the minified UMD version.

There is also 1 youtube video explaining how to use this from about 1 year ago at the time of writing, The shopify UI is outdated and the code is also outdated, so I don't wanna build all store with deprecated code so that I will need to re-do it. This is a huge deal for people like me that build websites for clients.

So in conclusion, I need help to know how to declare the client object or if anyone has already done it on Wordpress tell me how to do it please

This is the error I mentioned about missing the apiKey :

buy-button-storefront.min.js:2 Uncaught Error: new Config() requires the option 'apiKey' at buy-button-storefront.min.js:2 at Array.forEach () at n.constructor (buy-button-storefront.min.js:2) at new n (buy-button-storefront.min.js:2) at Object.buildClient (buy-button-storefront.min.js:3) at (index):235

Ad

Answer

This piece of code is actually working right now.

const client = ShopifyBuy.buildClient({
domain: 'website.myshopify.com',
storefrontAccessToken: 'storeaccesstokenid'
});

In addition to this, you need to add this to the footer

<script src="https://sdks.shopifycdn.com/js-buy-sdk/v1/latest/index.umd.min.js"></script>
Ad
source: stackoverflow.com
Ad