shopify-node-app-starter icon indicating copy to clipboard operation
shopify-node-app-starter copied to clipboard

How to integrate in app-extensions with Shopify

Open ivanleomk opened this issue 2 years ago • 4 comments

Hi there,

Thanks for making this amazing template, really helps to make shopify app dev much easier. I'm currently hoping to add in some extensions, in particular the checkout button ( Something like this : https://shopify.dev/apps/checkout/delivery-instructions )

How do you suggest doing so? Not too sure how i might go about doing so since the layout of the folder is a bit different as compared to the scaffolded one by shopify-cli

ivanleomk avatar Aug 27 '22 02:08 ivanleomk

That's a good question I also would like to hear @carstenlebek opinion, but I am more interested if we could replace all the CLI garbage with the original CLI package?

aimproxy avatar Sep 16 '22 21:09 aimproxy

That's a good question I also would like to hear @carstenlebek opinion, but I am more interested if we could replace all the CLI garbage with the original CLI package?

I feel like there's no way, I'm actually trying to add an express server over this build but wasn't succesful, so right now just trying to go back to a nodejs app..

alexandrosk avatar Nov 07 '22 08:11 alexandrosk

I'm trying to think ways to make this work with shopify cli, so it will be plug n play with anything CLI related like theme app extensions etc, I'm trying to move everything to a folder inside like the frontend, but we're missing a "main": "web/index.js", that doesn't exist on this repo. @aimproxy

alexandrosk avatar Nov 07 '22 21:11 alexandrosk

I managed to make it work with a theme app extension, here are the steps I did. Maybe it will work for you as well :)

  1. Install latest @shopify/cli and @shopify/app
  2. Add 2 package.json scripts:
"generate-extension": "shopify app generate extension",
"deploy": "shopify app deploy",
  1. Create a minimalistic shopify.app.toml file in root directory:
name = "Your App Name"
extension_directories = ["extensions/*"]
  1. Run npm run generate-extension - this will fire a extension creator which asks you what ext type you want (I believe a theme type was option 12)
  2. You should now have a extensions directory in your root
  3. Work with your extension and deploy it when ready with npm run deploy

e9aru avatar Mar 29 '23 15:03 e9aru