hydrogen icon indicating copy to clipboard operation
hydrogen copied to clipboard

[Bug]: Shopify CLI fails to import ESM module (prettier tailwind plugin)

Open danielvonmitschke opened this issue 3 months ago • 2 comments

Please confirm that you have:

  • [x] Searched existing issues to see if your issue is a duplicate. (If you’ve found a duplicate issue, feel free to add additional information in a comment on it.)
  • [x] Reproduced the issue in the latest CLI version.

In which of these areas are you experiencing a problem?

Hydrogen custom storefront

Expected behavior

shopify hydrogen codegen should work when using the prettier tailwind plugin.

Actual behavior

shopify hydrogen codegen throws an error

╭─ error ──────────────────────────────────────────────────────────────────────────────────────────────────────────────────────────────╮
│                                                                                                                                      │
│  [Codegen] require() cannot be used on an ESM graph with top-level await. Use import() instead. To see where the top-level await     │
│  comes from, use --experimental-print-required-tla.                                                                                  │
│                                                                                                                                      │
│  From node_modules/@shopify/cli/dist/chunk-PKR7KJ6P.js                                                                               │
│  Requiring node_modules/prettier-plugin-tailwindcss/dist/index.mjs                                                                   │
│                                                                                                                                      │
╰──────────────────────────────────────────────────────────────────────────────────────────────────────────────────────────────────────╯

Verbose output

Verbose output
2025-10-01T19:26:23.490Z: Running command hydrogen codegen
2025-10-01T19:26:23.492Z: Running system process in background:
· Command: /Users/xxx/.nvm/versions/node/v24.5.0/bin/node /Users/xxx/Sites/xxxxxx-hydrogen/xxxxxx/node_modules/.bin/shopify notifications list --ignore-errors
· Working directory: /Users/xxx/Sites/xxxxxx-hydrogen/xxxxxx

2025-10-01T19:26:23.495Z: Notifications to show: 0
╭─ error ────────────────────────────────────────────────────────────────────────────────╮
│                                                                                        │
│  Nonexistent flag: --verbose                                                           │
│  See more help with --help                                                             │
│                                                                                        │
╰────────────────────────────────────────────────────────────────────────────────────────╯

2025-10-01T19:26:23.519Z: Running system process:
· Command: npm prefix
· Working directory: /Users/xxx/Sites/xxxxxx-hydrogen/xxxxxx

2025-10-01T19:26:23.672Z: Obtaining the dependency manager in directory /Users/xxx/Sites/xxxxxx-hydrogen/xxxxxx...
2025-10-01T19:26:23.826Z: Getting current session ID...
2025-10-01T19:26:23.827Z: Getting current session ID...
2025-10-01T19:26:24.046Z: Request to https://monorail-edge.shopifysvc.com/v1/produce completed in 212 ms
With response headers:
- x-request-id: 5a0ff441-4e88-4aa9-9b3a-13d8b90103df
  
2025-10-01T19:26:24.046Z: Analytics event sent: {
"command": "hydrogen codegen",
"time_start": 1759346783490,
"time_end": 1759346783516,
"total_time": 26,
"success": false,
"cli_version": "3.85.4",
"ruby_version": "",
"node_version": "24.5.0",
"is_employee": false,
"uname": "darwin arm64",
"env_ci": false,
"env_plugin_installed_any_custom": false,
"env_plugin_installed_shopify": "[\"@shopify/cli\"]",
"env_shell": "bash",
"env_device_id": "502d77e54c84b4980acf848720121e19101690cf",
"env_cloud": "localhost",
"env_package_manager": "npm",
"env_is_global": false,
"env_auth_method": "device_auth",
"env_is_wsl": false,
"env_build_repository": "Shopify/cli",
"cmd_app_warning_api_key_deprecation_displayed": false,
"cmd_all_timing_network_ms": 0,
"cmd_all_timing_prompts_ms": 0,
"cmd_all_launcher": "npm",
"cmd_all_topic": "hydrogen",
"cmd_all_plugin": "@shopify/cli-hydrogen",
"cmd_all_timing_active_ms": 26,
"cmd_all_exit": "expected_error",
"user_id": "94ffe6ce-5c0d-4ad2-ad19-1f3deb5cf100",
"request_ids": [],
"args": "--verbose",
"error_message": "Nonexistent flag: --verbose\nSee more help with --help",
"env_plugin_installed_all": "[\"@shopify/cli\"]",
"metadata": "{\"extraPublic\":{},\"extraSensitive\":{}}"
}
2025-10-01T19:26:24.055Z: Reporting handled error to Bugsnag: Nonexistent flag: --verbose
See more help with --help
2025-10-01T19:26:24.420Z: Running system process:
· Command: npm prefix
· Working directory: /Users/xxx/Sites/xxxxxx-hydrogen/xxxxxx

2025-10-01T19:26:24.578Z: Obtaining the dependency manager in directory /Users/xxx/Sites/xxxxxx-hydrogen/xxxxxx...
2025-10-01T19:26:24.578Z: Getting current session ID...

Reproduction steps

  1. Shopify Hydrogen Skeleton Project
  2. Install tailwindv4 npm install tailwindcss @tailwindcss/vite
  3. Add tailwind to vite.config.js
import tailwindcss from "@tailwindcss/vite";
...
...
    plugins: [
        tailwindcss(), 
        hydrogen(), 
        oxygen(), 
        reactRouter(), 
        tsconfigPaths()
    ],
  1. Install tailwind prettier plugin npm install -D prettier prettier-plugin-tailwindcss
  2. Add "plugins": ["prettier-plugin-tailwindcss"] to the prettier config (usually in package.json in the hydrogen skeleton project)
  3. Run shopify hydrogen codegen

Operating System

Mac OS Sequioa

Shopify CLI version (shopify --version)

@shopify/cli/3.85.4 darwin-arm64 node-v24.5.0

Shell

bash

Node version (run node -v if you're not sure)

v24.5.0

What language and version are you using in your application?

No response

danielvonmitschke avatar Oct 01 '25 20:10 danielvonmitschke

Also just found this: https://github.com/Shopify/hydrogen/issues/2994

danielvonmitschke avatar Oct 01 '25 20:10 danielvonmitschke

Same issue on @shopify/cli/3.85.4 darwin-arm64 node-v22.20.0

coryagami avatar Oct 22 '25 18:10 coryagami