1. Reference: Deploying a Shopify PHP app to production (Alibaba Cloud, CentOS 7.7 64-bit in ECS, MySQL 5.7)
2. After creating and deploying the theme app extension in app: learn-php-app-ubuntu-2004-0605. Testing passed and met expectations. See Figure 1.
3. Upload the code under web in the local environment’s app: learn-php-app-ubuntu-2004-0605 to the production environment. Do not upload the directories: vendor, frontend/node_modules, frontend/dist.
4. After uploading the code to the production environment, rebuild the frontend and backend.
[root@iZ23wv7v5ggZ frontend]# npm install
[root@iZ23wv7v5ggZ frontend]# SHOPIFY_API_KEY=c7f826670575f7ae069f7e56350465ef npm run build
[root@iZ23wv7v5ggZ frontend]# cd ..
[root@iZ23wv7v5ggZ learn-php-app-0605-prod.shuijingwanwq.com]# composer build
> composer build-frontend-links
> ln -sf ../frontend/dist/assets public/assets && ln -sf ../frontend/dist/index.html public/index.html
5. Test the production app in the development store; it works normally.
6. Because the theme app extension needs to be created based on Shopify CLI, but Shopify CLI is not installed in the production environment. Creating and deploying the theme app extension can only be executed in the local environment. However, the app to bind needs to be the one in the production environment (i.e., the app in the Partner Center: learn-php-app-0605-prod). Copy the code from learn-php-app-ubuntu-2004-0605 to the directory: learn-php-app-0605-prod. Do not copy the directories: node_modules, web/vendor, web/frontend/node_modules, web/frontend/dist. The best practice should be for these two app directories to share the same Git repository to keep the code synchronized. Reference: Work on an existing app . Install the project dependencies.
wangqiang@DESKTOP-QLPK8QM:/mnt/e/wwwroot/shopify-app/learn-php-app-0605-prod$ sudo npm install
7. After installing the app dependencies, check the version to ensure Shopify CLI is available.
wangqiang@DESKTOP-QLPK8QM:/mnt/e/wwwroot/shopify-app/learn-php-app-0605-prod$ npm run shopify version
> learn-php-app-ubuntu-2004-0605@1.0.0 shopify
> shopify version
Current Shopify CLI version: 3.46.2
💡 Version 3.46.5 available! Run npm run shopify upgrade
8. Run the dev command. When running this command for the first time, connect it to the existing app in the Partner Center: learn-php-app-0605-prod, select the corresponding store to preview the app, and do not update the app’s URL to avoid affecting the use of the production app. See Figure 2.
wangqiang@DESKTOP-QLPK8QM:/mnt/e/wwwroot/shopify-app/learn-php-app-0605-prod$ npm run dev
> learn-php-app-ubuntu-2004-0605@1.0.0 dev
> shopify app dev
Looks like this is the first time you're running dev for this project.
Configure your preferences by answering a few questions.
Before you preview your work, it needs to be associated with an app.
? Create this project as a new app on Shopify?
> (y) Yes, create it as a new app
(n) No, connect it to an existing app
✔ No, connect it to an existing app
? Which existing app is this for?
> learn-php-app-0605-prod
learn-php-app-ubuntu-2004-0605
app-partners-20230530
theme-app-ext-example1
theme-app-extension-example
learn-node-app-20230524
learn-php-app-20230510
learn-node-app-20230509
learn-app-20221019
learn-app
✔ learn-php-app-0605-prod
? Which store would you like to use to view your project?
> shuijingwanwq-development
shuijingwanwq-development3
shuijingwanwq-development2
✔ shuijingwanwq-development
? Have Shopify automatically update your app's URL in order to create a preview experience?
Current app URL: • https://learn-php-app-0605-prod.shuijingwanwq.com/
Current redirect URLs: • https://learn-php-app-0605-prod.shuijingwanwq.com/api/auth/callback
(1) Always by default
(2) Yes, this time
(3) No, not now
> (4) Never, don't ask again
✔ Never, don't ask again
╭─ info ───────────────────────────────────────────────────────────────────────╮
│ │
│ To make URL updates manually, you can add the following URLs as redirects │
│ in your Partners Dashboard [1]: │
│ │
│ │
│ • https://tiger-foto-incident-sparc.trycloudflare.com/auth/callback │
│ • https://tiger-foto-incident-sparc.trycloudflare.com/auth/shopify/callb │
│ ack │
│ • https://tiger-foto-incident-sparc.trycloudflare.com/api/auth/callback │
│ │
╰──────────────────────────────────────────────────────────────────────────────╯
[1] https://partners.shopify.com/2442779/apps/44885082113/edit
theme-app-extension-0612 (Theme App Extension)
Follow the dev doc instructions ( https://shopify.dev/apps/online-store/theme-app-extensions/getting-started#step-3-test-your-changes ) by deploying your work as a draft
2023-06-15 03:17:46 │ frontend │
2023-06-15 03:17:46 │ frontend │ > shopify-frontend-template-react@1.0.0 dev
2023-06-15 03:17:46 │ frontend │ > vite
2023-06-15 03:17:46 │ frontend │
2023-06-15 03:17:47 │ backend │ > Composer\Config::disableProcessTimeout
2023-06-15 03:17:47 │ backend │ > php artisan serve
2023-06-15 03:17:47 │ backend │ PHP Warning: require(/mnt/e/wwwroot/shopify-app/learn-php-app-0605-prod/web/vendor/autoload.php): Failed to open
stream: No such file or directory in /mnt/e/wwwroot/shopify-app/learn-php-app-0605-prod/web/artisan on line 18
2023-06-15 03:17:47 │ backend │ PHP Fatal error: Uncaught Error: Failed opening required
'/mnt/e/wwwroot/shopify-app/learn-php-app-0605-prod/web/vendor/autoload.php' (include_path='.:/usr/share/php') in
/mnt/e/wwwroot/shopify-app/learn-php-app-0605-prod/web/artisan:18
2023-06-15 03:17:47 │ backend │ Stack trace:
2023-06-15 03:17:47 │ backend │ #0 {main}
2023-06-15 03:17:47 │ backend │ thrown in /mnt/e/wwwroot/shopify-app/learn-php-app-0605-prod/web/artisan on line 18
2023-06-15 03:17:47 │ backend │ Script php artisan serve handling the serve event returned with error code 255
Preview URL: https://tiger-foto-incident-sparc.trycloudflare.com?shop=shuijingwanwq-development.myshopify.com&host=c2h1a
Wppbmd3YW53cS1kZXZlbG9wbWVudC5teXNob3BpZnkuY29tL2FkbWlu
── external error ──────────────────────────────────────────────────────────────
Error coming from `composer serve`
Command failed with exit code 255: composer serve
> Composer\Config::disableProcessTimeout
> php artisan serve
PHP Warning: require(/mnt/e/wwwroot/shopify-app/learn-php-app-0605-prod/web/vendor/autoload.php): Failed to open
stream: No such file or directory in /mnt/e/wwwroot/shopify-app/learn-php-app-0605-prod/web/artisan on line 18
PHP Fatal error: Uncaught Error: Failed opening required
'/mnt/e/wwwroot/shopify-app/learn-php-app-0605-prod/web/vendor/autoload.php' (include_path='.:/usr/share/php') in
/mnt/e/wwwroot/shopify-app/learn-php-app-0605-prod/web/artisan:18
Stack trace:
#0 {main}
thrown in /mnt/e/wwwroot/shopify-app/learn-php-app-0605-prod/web/artisan on line 18
Script php artisan serve handling the serve event returned with error code 255
────────────────────────────────────────────────────────────────────────────────
9. An error occurred when executing the command: composer serve, because the PHP dependencies were not yet installed. However, the theme app extension: theme-app-extension-0612 had already been pushed to the Partner Center. See Figure 3.
wangqiang@DESKTOP-QLPK8QM:/mnt/e/wwwroot/shopify-app/learn-php-app-0605-prod/web$ composer install
10. After enabling the development store preview, executing the deploy command should create an extension version, and then stores that have installed this app can use this theme app extension. The extension version could not be created, which did not meet expectations. See Figure 4.
wangqiang@DESKTOP-QLPK8QM:/mnt/e/wwwroot/shopify-app/learn-php-app-0605-prod$ npm run deploy
> learn-php-app-ubuntu-2004-0605@1.0.0 deploy
> shopify app deploy
? Make the following changes to your extensions in Shopify Partners?
✔ Yes, deploy to push changes
Deploying your work to Shopify Partners. It will be part of learn-php-app-ubuntu-2004-0605
theme_extensions │ Running theme check on your Theme app extension...
theme_extensions │ Checking /mnt/e/wwwroot/shopify-app/learn-php-app-0605-prod/extensions/theme-app-extension-0612 ...
theme_extensions │ 4 files inspected, 0 offenses detected, 0 offenses auto-correctable
╭─ success ────────────────────────────────────────────────────────────────────╮
│ │
│ Deployed to Shopify! │
│ │
│ Summary │
│ • theme-app-extension-0612 is deployed to Shopify but not yet live │
│ │
│ Next steps │
│ • Publish theme-app-extension-0612 [1] │
│ │
╰──────────────────────────────────────────────────────────────────────────────╯
[1] https://partners.shopify.com/2442779/apps/44874072065/extensions/theme_app_extension/25583255553
11. Found that it was still being pushed and deployed to the pre-copy app learn-php-app-ubuntu-2004-0605. See Figure 5.
12. Re-run the dev (reconfigure) command. During execution, there was: Pushed » ‘theme-app-extension-0612’ to a draft. The app extension version could now be created. See Figure 6.
wangqiang@DESKTOP-QLPK8QM:/mnt/e/wwwroot/shopify-app/learn-php-app-0605-prod$ npm run dev -- --reset
> learn-php-app-ubuntu-2004-0605@1.0.0 dev
> shopify app dev --reset
Before you preview your work, it needs to be associated with an app.
? Create this project as a new app on Shopify?
✔ No, connect it to an existing app
? Which existing app is this for?
✔ learn-php-app-0605-prod
? Which store would you like to use to view your project?
✔ shuijingwanwq-development
? Have Shopify automatically update your app's URL in order to create a preview experience?
✔ Never, don't ask again
╭─ info ───────────────────────────────────────────────────────────────────────╮
│ │
│ To make URL updates manually, you can add the following URLs as redirects │
│ in your Partners Dashboard [1]: │
│ │
│ │
│ • https://shape-vaccine-crop-xl.trycloudflare.com/auth/callback │
│ • https://shape-vaccine-crop-xl.trycloudflare.com/auth/shopify/callback │
│ • https://shape-vaccine-crop-xl.trycloudflare.com/api/auth/callback │
│ │
╰──────────────────────────────────────────────────────────────────────────────╯
[1] https://partners.shopify.com/2442779/apps/44885082113/edit
theme-app-extension-0612 (Theme App Extension)
Follow the dev doc instructions ( https://shopify.dev/apps/online-store/theme-app-extensions/getting-started#step-3-test-your-changes ) by deploying your work as a draft
2023-06-15 05:54:27 │ frontend │
2023-06-15 05:54:27 │ frontend │ > shopify-frontend-template-react@1.0.0 dev
2023-06-15 05:54:27 │ frontend │ > vite
2023-06-15 05:54:27 │ frontend │
2023-06-15 05:54:29 │ webhooks │ Sending APP_UNINSTALLED webhook to app server
2023-06-15 05:54:29 │ webhooks │ App isn't responding yet, retrying in 5 seconds
2023-06-15 05:54:34 │ webhooks │ App isn't responding yet, retrying in 5 seconds
2023-06-15 05:54:35 │ frontend │
2023-06-15 05:54:35 │ frontend │ VITE v4.3.9 ready in 7797 ms
2023-06-15 05:54:35 │ frontend │
2023-06-15 05:54:35 │ frontend │ ➜ Local: http://localhost:33151/
2023-06-15 05:54:36 │ backend │ > Composer\Config::disableProcessTimeout
2023-06-15 05:54:36 │ backend │ > php artisan serve
2023-06-15 05:54:39 │ webhooks │ App isn't responding yet, retrying in 5 seconds
2023-06-15 05:54:44 │ webhooks │ App hasn't started in time, giving up
2023-06-15 05:54:44 │ webhooks │ APP_UNINSTALLED webhook delivery failed
2023-06-15 05:54:54 │ backend │ Starting Laravel development server: http://127.0.0.1:41775
2023-06-15 05:54:54 │ backend │ [Thu Jun 15 13:54:54 2023] PHP 8.1.18 Development Server (http://127.0.0.1:41775) started
2023-06-15 05:55:21 │ extensions │
2023-06-15 05:55:21 │ extensions │ --------- Pushing theme files to App Ext. Host (96e4f9-DESKTOP-QLPK8QM) (#133838078137) on
shuijingwanwq-development.myshopify.com
2023-06-15 05:55:21 │ extensions │ Pushing theme... 0%
2023-06-15 05:55:33 │ backend │ [Thu Jun 15 13:55:33 2023] 127.0.0.1:42178 Accepted
2023-06-15 05:55:42 │ backend │ [Thu Jun 15 13:55:42 2023] 127.0.0.1:42178 Closing
2023-06-15 05:55:42 │ backend │ [Thu Jun 15 13:55:42 2023] 127.0.0.1:42184 Accepted
2023-06-15 05:55:45 │ backend │ [Thu Jun 15 13:55:44 2023] 127.0.0.1:42184 Closing
2023-06-15 05:56:25 │ extensions │ Pushing theme... 36%
2023-06-15 05:56:27 │ extensions │ Pushing theme... 52%
2023-06-15 05:56:27 │ extensions │ Pushing theme... 68%
2023-06-15 05:56:27 │ extensions │ Pushing theme... 84%
2023-06-15 05:56:27 │ extensions │ Pushing theme... 100%
2023-06-15 05:56:29 │ extensions │ ------------------
2023-06-15 05:56:31 │ extensions │
2023-06-15 05:56:31 │ extensions │ --------- Viewing extension…
2023-06-15 05:56:31 │ extensions │ Enable your theme app extension:
2023-06-15 05:56:31 │ extensions │ https://partners.shopify.com/2442779/apps/44885082113/extensions/theme_app_extension/25719668737
2023-06-15 05:56:31 │ extensions │
2023-06-15 05:56:31 │ extensions │ Setup your theme app extension in the host theme:
2023-06-15 05:56:31 │ extensions │ https://shuijingwanwq-development.myshopify.com/admin/themes/133838078137/editor
2023-06-15 05:56:31 │ extensions │
2023-06-15 05:56:31 │ extensions │ Preview your theme app extension:
2023-06-15 05:56:31 │ extensions │ http://127.0.0.1:9292
2023-06-15 05:56:31 │ extensions │ ------------------
2023-06-15 05:56:34 │ extensions │ Pushed » 'theme-app-extension-0612' to a draft
2023-06-15 05:56:34 │ extensions │ - blocks/star_rating.liquid
2023-06-15 05:56:34 │ extensions │ - snippets/stars.liquid
2023-06-15 05:56:34 │ extensions │ - locales/en.default.json
2023-06-15 05:56:34 │ extensions │ - assets/thumbs-up.png
2023-06-15 06:39:08 │ extensions │ Stopping…
› Press p │ preview in your browser
› Press q │ quit
Preview URL: https://shape-vaccine-crop-xl.trycloudflare.com?shop=shuijingwanwq-development.myshopify.com&host=c2h1aWppb
md3YW53cS1kZXZlbG9wbWVudC5teXNob3BpZnkuY29tL2FkbWlu
13. App: learn-php-app-0605-prod has been distributed to store: shuijingwanwq-development3. See Figure 7.
14. Create a version of the theme app extension and publish it: 1.0.0. See Figure 8.
15. Open the editor for any theme of store: shuijingwanwq-development3, and you can use the theme app extension by adding an app block. See Figure 9.
16. View the homepage, the theme app extension is already displayed. See Figure 10.
17. After updating the theme extension app code, execute the deploy command. Found that it was still deploying to the pre-copy app: learn-php-app-ubuntu-2004-0605.
wangqiang@DESKTOP-QLPK8QM:/mnt/e/wwwroot/shopify-app/learn-php-app-0605-prod$ npm run deploy
> learn-php-app-ubuntu-2004-0605@1.0.0 deploy
> shopify app deploy
? Make the following changes to your extensions in Shopify Partners?
✔ Yes, deploy to push changes
Deploying your work to Shopify Partners. It will be part of learn-php-app-ubuntu-2004-0605
theme_extensions │ Running theme check on your Theme app extension...
theme_extensions │ Checking /mnt/e/wwwroot/shopify-app/learn-php-app-0605-prod/extensions/theme-app-extension-0612 ...
theme_extensions │ 4 files inspected, 0 offenses detected, 0 offenses auto-correctable
╭─ success ────────────────────────────────────────────────────────────────────╮
│ │
│ Deployed to Shopify! │
│ │
│ Summary │
│ • theme-app-extension-0612 is deployed to Shopify but not yet live │
│ │
│ Next steps │
│ • Publish theme-app-extension-0612 [1] │
│ │
╰──────────────────────────────────────────────────────────────────────────────╯
[1] https://partners.shopify.com/2442779/apps/44874072065/extensions/theme_app_extension/25583255553
18. Re-execute the env pull command to specify the app as: learn-php-app-0605-prod. This updates the environment variables for the existing app and app extension. See Figure 11.
wangqiang@DESKTOP-QLPK8QM:/mnt/e/wwwroot/shopify-app/learn-php-app-0605-prod$ npm run shopify app env pull
> learn-php-app-ubuntu-2004-0605@1.0.0 shopify
> shopify app env pull
? Which existing app is this for?
✔ learn-php-app-0605-prod
Updated .env to be:
SHOPIFY_API_KEY=c7f826670575f7ae069f7e56350465ef
SHOPIFY_THEME_APP_EXTENSION_0612_ID=a680449a-9537-45bf-a010-4d8cadacf5e1
SHOPIFY_API_SECRET=4de64aa8281e97055cf7698bbe56039e
SCOPES=write_products
Here's what changed:
- SHOPIFY_API_KEY=02c894a155c74ca837babfcf043ae4ed
+ SHOPIFY_API_KEY=c7f826670575f7ae069f7e56350465ef
SHOPIFY_THEME_APP_EXTENSION_0612_ID=a680449a-9537-45bf-a010-4d8cadacf5e1
+ SHOPIFY_API_SECRET=4de64aa8281e97055cf7698bbe56039e
+ SCOPES=write_products
19. Execute the deploy command again, then create a new extension version: 1.2.0 and publish it. Waited for about 3 minutes, the homepage changed, and the new changes were applied, changing from 0615 to 0616. See Figure 12.
wangqiang@DESKTOP-QLPK8QM:/mnt/e/wwwroot/shopify-app/learn-php-app-0605-prod$ npm run deploy
> learn-php-app-ubuntu-2004-0605@1.0.0 deploy
> shopify app deploy
? Make the following changes to your extensions in Shopify Partners?
✔ Yes, deploy to push changes
Deploying your work to Shopify Partners. It will be part of learn-php-app-0605-prod
theme_extensions │ Running theme check on your Theme app extension...
theme_extensions │ Checking /mnt/e/wwwroot/shopify-app/learn-php-app-0605-prod/extensions/theme-app-extension-0612 ...
theme_extensions │ 4 files inspected, 0 offenses detected, 0 offenses auto-correctable
╭─ success ────────────────────────────────────────────────────────────────────╮
│ │
│ Deployed to Shopify! │
│ │
│ Summary │
│ • theme-app-extension-0612 is deployed to Shopify but not yet live │
│ │
│ Next steps │
│ • Publish theme-app-extension-0612 [1] │
│ │
╰──────────────────────────────────────────────────────────────────────────────╯
[1] https://partners.shopify.com/2442779/apps/44885082113/extensions/theme_app_extension/25719668737