Cloudflare Developers•3mo ago

Pages deployment Error: Output directory "[foldername]/dist " not found.

Hi, I am currently trying to deploy a website following this tutorial: https://developers.cloudflare.com/pages/framework-guides/deploy-a-vite3-project/ But using React instead of Vue. The directory is inside a subdirectory of the project and I set the root directory inside the build parameters accordingly. The build is working:

20:27:56.293    > tsc -b && vite build
20:27:56.293    
20:27:57.836    vite v5.4.8 building for production...
20:27:58.178    transforming...
20:27:58.445    
20:27:58.445    warn - No utility classes were detected in your source files. If this is unexpected, double-check the `content` option in your Tailwind CSS configuration.
20:27:58.446    warn - https://tailwindcss.com/docs/content-configuration
20:27:59.104    ✓ 34 modules transformed.
20:27:59.206    rendering chunks...
20:27:59.212    computing gzip size...
20:27:59.220    dist/index.html                   0.46 kB │ gzip:  0.30 kB
20:27:59.221    dist/assets/react-CHdo91hT.svg    4.13 kB │ gzip:  2.14 kB
20:27:59.221    dist/assets/index-D_VJ8pxC.css    6.12 kB │ gzip:  1.96 kB
20:27:59.221    dist/assets/index-D0iOo60g.js   143.20 kB │ gzip: 46.03 kB
20:27:59.221    ✓ built in 1.36s
20:27:59.264    Finished

20:27:56.293    > tsc -b && vite build
20:27:56.293    
20:27:57.836    vite v5.4.8 building for production...
20:27:58.178    transforming...
20:27:58.445    
20:27:58.445    warn - No utility classes were detected in your source files. If this is unexpected, double-check the `content` option in your Tailwind CSS configuration.
20:27:58.446    warn - https://tailwindcss.com/docs/content-configuration
20:27:59.104    ✓ 34 modules transformed.
20:27:59.206    rendering chunks...
20:27:59.212    computing gzip size...
20:27:59.220    dist/index.html                   0.46 kB │ gzip:  0.30 kB
20:27:59.221    dist/assets/react-CHdo91hT.svg    4.13 kB │ gzip:  2.14 kB
20:27:59.221    dist/assets/index-D_VJ8pxC.css    6.12 kB │ gzip:  1.96 kB
20:27:59.221    dist/assets/index-D0iOo60g.js   143.20 kB │ gzip: 46.03 kB
20:27:59.221    ✓ built in 1.36s
20:27:59.264    Finished

But still the build output directory "dist" (which is generated locally) is not found. I would really appreciate some help. Thanks a lot in advance.

Cloudflare Docs

Vite 3 | Cloudflare Pages docs

Vite ↗ is a next-generation build tool for front-end developers. With the release of Vite 3 ↗, developers can make use of new command line (CLI) improvements, starter templates, and more ↗ to help build their front-end applications.

8 Replies

Walshy•3mo ago

what is your build output set to? also deployment id?

NossOP•3mo ago

Build command:
npm run build
Build output directory:
/dist
Build system version:
2 (latest)
Root directory:
/[rootFolderName]
Environment variables:
None

Build command:
npm run build
Build output directory:
/dist
Build system version:
2 (latest)
Root directory:
/[rootFolderName]
Environment variables:
None

And where can I find the deployment id? In the url?

6153f508-1216-4b46-980d-23aa32e9ae97

6153f508-1216-4b46-980d-23aa32e9ae97

Is the last part of the url

Walshy•3mo ago

you have a space in your output dir

Walshy•3mo ago

that's likely what is causing it

NossOP•3mo ago

:LULE: Solved it. Thanks a lot 😄

Walshy•3mo ago

cc: @Will Taylor | Workers seems like a quick win to .trim() this if you want it

NossOP•3mo ago

Maybe worth a fix? Trailing whitespaces are not possible in this context ^^

texan•3mo ago

I want all the beans 😂

Gaming

Programming

Pages deployment Error: Output directory "[foldername]/dist " not found.