Problems with Hydrogen Install for local dev environment

[Wayne7]

Apologies if this is the wrong place to ask this question.

I had installed the Hydrogen Demo Store for local dev and it was running. Then I tried to install the Hello World version and got errors. Now I can’t get anything to run. I delete the @Shopify_77 module from the npm-cache and tried to reinstall and now I’m getting errors pasted in below (“w***” is avalid directory, anonymized for this post).

Is there a way to either clean out all of the Hydrogen and related items and start over, or a way to simply fix this error?

Running npm and node.js on Windows 11

Thanks in advance for any help.

Here is the terminal read out:

PS C:\Users\wayne\gh-hydrogen> npm create @Shopify_77 [email removed]
Need to install the following packages:
@Shopify_77 [email removed]
Ok to proceed? (y) y
npm WARN ERESOLVE overriding peer dependency
npm WARN While resolving: [email removed]
npm WARN Found: [email removed]
npm WARN node_modules/react
npm WARN peer [email removed] from @remix-run/[email removed]
npm WARN node_modules/@remix-run/react
npm WARN peer @remix-run/[email removed] from @Shopify_77 [email removed]
npm WARN node_modules/@shopify/cli-hydrogen
npm WARN 8 more (@shopify/hydrogen-react, @xstate/react, ink, react-dom, …)
npm WARN
npm WARN Could not resolve dependency:
npm WARN peer [email removed] from [email removed]
npm WARN node_modules/ink/node_modules/react-reconciler
npm WARN [email removed] from [email removed]
npm WARN node_modules/ink
npm WARN
npm WARN Conflicting peer dependency: [email removed]
npm WARN node_modules/react
npm WARN peer [email removed] from [email removed]
npm WARN node_modules/ink/node_modules/react-reconciler
npm WARN [email removed] from [email removed]
npm WARN node_modules/ink
Choose a template · Demo Store
Choose a language · JavaScript
Where would you like to create your app? · gh-hydrogen
C:\Users\w***\AppData\Local\npm-cache_npx\e1eac94ad41cc36f\node_modules\yoga-layout-prebuilt\yoga-layout\build\Release\nbind.js:53
throw ex;
^

[Error: ENOENT: no such file or directory, lstat [email removed] {
errno: -4058,
code: ‘ENOENT’,
syscall: ‘lstat’,
path: ‘C:\Users\w***\AppData\Local\npm-cache\_npx\e1eac94ad41cc36f\node_modules\@shopify\[email removed]
}

Node.js v19.6.0
npm ERR! code 7
npm ERR! path C:\Users\w****\gh-hydrogen
npm ERR! command failed
npm ERR! command C:\WINDOWS\system32\cmd.exe /d /s /c create-hydrogen

npm ERR! A complete log of this run can be found in:
npm ERR! C:\Users\w****\AppData\Local\npm-cache_logs\2023-02-12T18_28_54_019Z-debug-0.log

The log file has this:

[lots of items with no errors, then…]

280 timing metavuln:calculate:security-advisory:@shopify/cli-hydrogen:pBnyMPnwcPi5u41zxkmQuqsafgS1tJqxlYCwHCcDXYTq6IMrXtqhl6q4Y5k8J6e1qka4zl75mhnAoX9OKpctkA== Completed in 2ms
281 timing auditReport:init Completed in 2737ms
282 timing reify:audit Completed in 3007ms
283 timing reify Completed in 3431ms
284 timing command:create Completed in 62638ms
285 verbose stack Error: command failed
285 verbose stack at ChildProcess. [email removed]
285 verbose stack at ChildProcess.emit (node:events:512:28)
285 verbose stack at maybeClose (node:internal/child_process:1098:16)
285 verbose stack at ChildProcess._handle.onexit (node:internal/child_process:304:5)
286 verbose pkgid [email removed]
287 verbose cwd C:\Users\w***\gh-hydrogen
288 verbose Windows_NT 10.0.22621
289 verbose node v19.6.0
290 verbose npm v8.19.2
291 error code 7
292 error path C:\Users\w***\gh-hydrogen
293 error command failed
294 error command C:\WINDOWS\system32\cmd.exe /d /s /c create-hydrogen
295 verbose exit 7
296 timing npm Completed in 62729ms
297 verbose code 7
298 error A complete log of this run can be found in:
298 error C:\Users\w***\AppData\Local\npm-cache_logs\2023-02-12T18_28_54_019Z-debug-0.log

[paperkrane]

Getting this same error. Were you ever able to resolve it?

[VsisodiyaDesign]

Hi Wayne,

I am facing same issue , did your issue is solve ?

[Wayne7]

No, still no solution

[saad_ahmed_khan]

Same issue here

[Wayne7]

So, I downloaded the code from github here: https://github.com/Shopify/hydrogen

as a zip file and extracted the folders in the template directory and put them in the npm cache, which on my PC is located at:

[email removed]

where w*** is the username

This allowed the init command to run, but with a new error as shown below:

c:\Users\w***\hydrogen>npm init @Shopify_77 [email removed]
Choose a template · Demo Store
Choose a language · JavaScript
Where would you like to create your app? · gh-demo
Install dependencies with npm? · Yes
npm WARN ERESOLVE overriding peer dependency
npm WARN deprecated @npmcli/[email removed] This functionality has been moved to @npmcli/fs
npm WARN deprecated @oclif/[email removed] Deprecated in favor of @oclif/core
npm WARN deprecated [email removed] This package has been deprecated and is no longer maintained. Please use @rollup/plugin-inject.
npm WARN deprecated [email removed] Please use @jridgewell/sourcemap-codec instead

added 1514 packages, and audited 1515 packages in 27s

366 packages are looking for funding
run npm fund for details

14 vulnerabilities (3 moderate, 10 high, 1 critical)

To address all issues (including breaking changes), run:
npm audit fix --force

Run npm audit for details.

success gh-demo is ready to build.

Next steps
Run cd gh-demo and npm run dev to start your local development server and start building.

Reference
Building with Hydrogen:
https://shopify.dev/custom-storefronts/hydrogen
info Your project will display inventory from the Hydrogen Demo Store.
To connect this project to your Shopify store’s inventory, update
gh-demo/.env with your store ID and Storefront API key.

c:\Users\wayne\hydrogen>cd gh-demo

c:\Users\wayne\hydrogen\gh-demo>npm run dev

[email removed] dev
npm run build:css && concurrently -g --kill-others-on-fail -r npm:dev:css “shopify hydrogen dev”

[email removed] build:css
postcss styles --base styles --dir app/styles --env production

[email removed] dev:css
postcss styles --base styles --dir app/styles -w

error ENOENT: no such file or directory, scandir ‘c:\c:\Users\wayne\hydrogen\gh- │
[email removed]
To investigate the issue, examine this stack trace:
at Error: ENOENT: no such file or directory, scandir
'c:\c:\Users\wayne\hydrogen\gh-demo\node_modules\

The path that is throwing the error has an apparent flaw as it starts with c:\c:, instead of just c:\

The corrected path exists, but so far I’m unable to figure how to fix this new problem.

[mark-weitz]

Hey I am pretty new to hydrogen development but I had the same problem as this:

"The path that is throwing the error has an apparent flaw as it starts with c:\c:, instead of just c:"

Just with the root domain so: “https://http” I figured out that somehow the prefix https:// is delivered with some method so I just removed it in my input and then it worked.

BIG BUT: I was using the old hydrogen version since I am trying to get up to date I have similar issues with the whole dependencies things.

@Shopify_77 I think you have missleeding docs e.g. when you init the project over the Shopify web app directly in Github and then try to follow your guide on how to update to the new version (https://shopify.dev/docs/custom-storefronts/hydrogen/migrate-hydrogen-remix) you refer to the HelloWorld repo that has different files and structure espessically in Step 9 renaming the routes. Since there is no folder “routes” which should hold a index.jsx file I think you mixing with the demo store template. But if you want to stick to the structure and start copying the files everything gets mixed up and it’s very difficult to debug this then again.

It would be good to have two separate setup guides to cover both of the templates from start to end.

[VsisodiyaDesign]

Yes document is seriously not updated , i delete very thing and start fresh now it working fine .

[mark-weitz]

Would you mind to give me some tips. I already deployed two basic stores with the old versions. For now I am looking for the new version but what ever path I take (over Shopify or Shopify cli) I always get the old version and as soon as I start to try to get closer to the ones in their repo everything gets messed up.

They also have two different up to date branches and I don’t know which one to choose:

1: https://github.com/Shopify/hydrogen/tree/dist/templates/demo-store-js

2: https://github.com/Shopify/hydrogen/tree/2023-01/templates/demo-store

Would be very thankful if you could give a hand to show me how.

Best,

Mark

[prorakib]

[email removed] MINGW64 ~/Desktop/Shopify_Projects/shopify_hydrozen
$ npm create @Shopify_77 [email removed]
file:///C:/Users/DELL/AppData/Local/npm-cache/_npx/e1eac94ad41cc36f/node_modules/@shopify/create-hydrogen/dist/chunk-QUKX7CP5.js:909
This usually happens when running a command non-interactively, for example in a CI environment, or when piping to or from another process.;throw new yh(u,"To resolve this, specify the option in the command, or run the command in an interactive environment such as your local terminal.")}var TIt=za(kze(),1);N();var oP=class extends Error{constructor(...r){super(...r);var i=r.length>0&&typeof r[0]=="string"?r[0]:"";(this.name===void 0||this.name==="Error")&&Object.defineProperty(this,"name",{configurable:!0,enumerable:!1,value:this.constructor.name,writable:!0}),Object.defineProperty(this,"message",{configurable:!0,enumerable:!1,value:i,writable:!0}),Object.defineProperty(this,"stack",{configurable:!0,enumerable:!1,value:"",writable:!0}),Error.captureStackTrace?Error.captureStackTrace(this,this.constructor):this.stack===""&&(this.stack=new Error(i).stack)}};var cJ;(function(n){n[n.Abort=0]="Abort",n[n.AbortSilent=1]="AbortSilent",n[n.Bug=2]="Bug"})(cJ||(cJ={}));var w6e=class extends Error{},RB=class extends Error{constructor(r,i,o=null,u,d){let h=typeof r=="string"||"value"in r;super(h?Hv(r):Kw(r)),o?o instanceof rZ?this.tryMessage=Hv(o):this.tryMessage=o:this.tryMessage=null,this.type=i,this.nextSteps=u,this.customSections=d,this.skipOclifErrorHandling=!0,h||(this.formattedMessage=r)}},yh=class extends RB{constructor(r,i=null,o,u){super(r,cJ.Abort,i,o,u)}},KK=class extends RB{constructor(r,i,o,u=null){super(r,cJ.Abort,u),this.command=i,this.args=o}},pQ=class extends RB{constructor(){super("",cJ.AbortSilent)}},Yy=class extends RB{constructor(r,i=null){super(r,cJ.Bug,i)}};async function DIt(n){let r;if(wIt(n))r=n;else if(typeof n=="string")r=new Yy(n);else if(n instanceof Error)r=new Yy(n.message),r.stack=n.stack;else{let i=n;r=new Yy(i?.message??"Unknown error"),i?.stack&&(r.stack=i?.stack)}return Cwt(r),Promise.resolve(n)}function CIt(n){if(n instanceof TIt.Errors.CLIError){let r=new yh(n.message);return r.stack=n.stack,Promise.resolve(r)}else return Promise.resolve(n)}function wIt(n){try{return Object.prototype.hasOwnProperty.call(n,"type")}catch{return!1}}function kIt(n){if(!wIt(n)){if(n instanceof Error){let r=n.message;return!jQr(r)}return!0}return n.type===cJ.Bug}function sxe(n){return DV(n).replace("file:/","/").replace(/^\/?[A-Z]:/,"")}function jQr(n){return["EPERM: operation not permitted, scandir","EPERM: operation not permitted, rename","EACCES: permission denied","EPERM: operation not permitted, symlink","This version of npm supports the following node versions","EBUSY: resource busy or locked","ENOTEMPTY: directory not empty","getaddrinfo ENOTFOUND","Client network socket disconnected before secure TLS connection was established","spawn EPERM","socket hang up"].some(o=>n.includes(o))}N();N();var cOt=za(a$e(),1);import{Buffer as UZr}from"node:buffer";import qZr from"node:path";import $ze from"node:child_process";import R6e from"node:process";N();function Aze(n){let r=typeof n=="string"?
^

yh [Error]: Failed to prompt:

Connect to Shopify

This usually happens when running a command non-interactively, for example in a CI environment, or when piping to or from another process.
at jUe (file:///C:/Users/DELL/AppData/Local/npm-cache/_npx/e1eac94ad41cc36f/node_modules/@shopify/create-hydrogen/dist/chunk-QUKX7CP5.js:909:147)
at wwt (file:///C:/Users/DELL/AppData/Local/npm-cache/_npx/e1eac94ad41cc36f/node_modules/@shopify/create-hydrogen/dist/chunk-QUKX7CP5.js:905:15937)
at C5e (file:///C:/Users/DELL/AppData/Local/npm-cache/_npx/e1eac94ad41cc36f/node_modules/@shopify/create-hydrogen/dist/create-app.js:1595:331)
at DPe (file:///C:/Users/DELL/AppData/Local/npm-cache/_npx/e1eac94ad41cc36f/node_modules/@shopify/create-hydrogen/dist/create-app.js:1605:284)
at sme (file:///C:/Users/DELL/AppData/Local/npm-cache/_npx/e1eac94ad41cc36f/node_modules/@shopify/create-hydrogen/dist/create-app.js:1605:2464)
at process.processTicksAndRejections (node:internal/process/task_queues:95:5) {
tryMessage: ‘To resolve this, specify the option in the command, or run the command in an interactive environment such as your local terminal.’,
type: 0,
nextSteps: undefined,
customSections: undefined,
skipOclifErrorHandling: true
}

Node.js v20.4.0
npm ERR! code 1
npm ERR! path C:\Users\DELL\Desktop\Shopify_Projects\shopify_hydrozen
npm ERR! command failed
npm ERR! command C:\WINDOWS\system32\cmd.exe /d /s /c create-hydrogen

npm ERR! A complete log of this run can be found in: C:\Users\DELL\AppData\Local\npm-cache_logs\2025-06-14T22_59_56_998Z-debug-0.log

I have this issue Does anyone have the solutions??