# Netlify throws 404 error on deploy for vite. Tried \_redirect, tried adding netflify.toml. Nothing works

**URL:** <https://answers.netlify.com/t/netlify-throws-404-error-on-deploy-for-vite-tried-redirect-tried-adding-netflify-toml-nothing-works/111123>\
**Category:** Support\
**Tags:** netlify-newbie\
**Created:** [January 26, 2024, 2:33pm UTC](https://answers.netlify.com/t/netlify-throws-404-error-on-deploy-for-vite-tried-redirect-tried-adding-netflify-toml-nothing-works/111123 "2024-01-26T14:33:59Z")\
**Posts on this page:** 16\
**Page:** 1

<div class="post-metadata">

**Author:** ![learntocode](https://avatars.discourse-cdn.com/v4/letter/l/45deac/32.png) [@learntocode](https://answers.netlify.com/u/learntocode)\
**Post date:** [January 26, 2024, 2:33pm UTC](https://answers.netlify.com/t/netlify-throws-404-error-on-deploy-for-vite-tried-redirect-tried-adding-netflify-toml-nothing-works/111123/1 "2024-01-26T14:33:59Z")

</div>

This issue is driving me nuts. In vite, my `index.html` file sits outside of the public folder by default. So I added a \_redirects file to the public folder and also tried adding a `netlify.toml` file.

Neither works. Tried placing both in the root, both in public, one in public and one in root…

NOTHING WORKS:

![image](https://global.discourse-cdn.com/netlify/original/3X/a/f/af04d98a34624db9e1c148cfae089ebc395f40ef.png)

My netlify.toml file is :  
[build]  
command = “npm run build”  
publish = “/build”  
base =“/”

[[redirects]]  
from = “/\*”  
to = “/index.html”  
status = 200

And my \_redirect is:  
/\* /index.html 200

Am I missing a step in the deployment process or something?

Extremely frustrating that netlify works fine with create react app but vite completely falls apart at deployment. Can someone help? Thanks

---

<div class="post-metadata">

**Author:** ![hrishikesh](https://sea1.discourse-cdn.com/netlify/user_avatar/answers.netlify.com/hrishikesh/32/74607_2.png) [@hrishikesh](https://answers.netlify.com/u/hrishikesh)\
**Post date:** [January 26, 2024, 5:12pm UTC](https://answers.netlify.com/t/netlify-throws-404-error-on-deploy-for-vite-tried-redirect-tried-adding-netflify-toml-nothing-works/111123/2 "2024-01-26T17:12:18Z")

</div>

> [@learntocode](#):
>
> Extremely frustrating that netlify works fine with create react app but vite completely falls apart at deployment.

Do you have any data to back that up? Without determining this is a Netlify issue, I think it’s a little unfair to make such a statement. I use Vite and have used it since v1 and never had an issue.

In any case, you have not shared any info about the site, happy to check this further if you share some info.

> [@learntocode](#):
>
> publish = “/build”

Vite outputs in dist as far as I know, so that’s a potential problem.

---

<div class="post-metadata">

**Author:** ![learntocode](https://avatars.discourse-cdn.com/v4/letter/l/45deac/32.png) [@learntocode](https://answers.netlify.com/u/learntocode)\
**Post date:** [January 26, 2024, 5:48pm UTC](https://answers.netlify.com/t/netlify-throws-404-error-on-deploy-for-vite-tried-redirect-tried-adding-netflify-toml-nothing-works/111123/3 "2024-01-26T17:48:50Z")

</div>

I changed this to /dist and it did not resolve the issue.  
[build]  
command = “npm run build”  
publish = “/dist”  
base =“/”

[[redirects]]  
from = “/\*”  
to = “/index.html”  
status = 200

Deploy logs give me no errors and deploys fine.

What info do you need about the site?

---

<div class="post-metadata">

**Author:** ![SamO](https://sea1.discourse-cdn.com/netlify/user_avatar/answers.netlify.com/samo/32/41847_2.png) [@SamO](https://answers.netlify.com/u/SamO)\
**Post date:** [January 26, 2024, 5:49pm UTC](https://answers.netlify.com/t/netlify-throws-404-error-on-deploy-for-vite-tried-redirect-tried-adding-netflify-toml-nothing-works/111123/4 "2024-01-26T17:49:39Z")

</div>

Hi for one the site Id or site name would be helpful.

---

<div class="post-metadata">

**Author:** ![learntocode](https://avatars.discourse-cdn.com/v4/letter/l/45deac/32.png) [@learntocode](https://answers.netlify.com/u/learntocode)\
**Post date:** [January 26, 2024, 5:52pm UTC](https://answers.netlify.com/t/netlify-throws-404-error-on-deploy-for-vite-tried-redirect-tried-adding-netflify-toml-nothing-works/111123/5 "2024-01-26T17:52:42Z")

</div>

Hi,

The site is [https://ubiquitous-klepon-d4ee71.netlify.app/](https://ubiquitous-klepon-d4ee71.netlify.app/)  
site ID e0ffef35-a7b9-40f7-8913-5695d4d5b887

---

<div class="post-metadata">

**Author:** ![hrishikesh](https://sea1.discourse-cdn.com/netlify/user_avatar/answers.netlify.com/hrishikesh/32/74607_2.png) [@hrishikesh](https://answers.netlify.com/u/hrishikesh)\
**Post date:** [January 26, 2024, 5:55pm UTC](https://answers.netlify.com/t/netlify-throws-404-error-on-deploy-for-vite-tried-redirect-tried-adding-netflify-toml-nothing-works/111123/6 "2024-01-26T17:55:35Z")

</div>

A closer look at the logs reveals the issue:

 ![image](https://global.discourse-cdn.com/netlify/original/3X/6/f/6f628979a703cc31e05b8056023e4cd167b50d35.png)

You’re not building your site at all. Not sure where you have the `netlify.toml` you have mentioned, but you don’t have any build settings: [Build & deploy | Site configuration | ubiquitous-klepon-d4ee71 | Netlify](https://app.netlify.com/sites/ubiquitous-klepon-d4ee71/configuration/deploys#build-settings)

Adding `npm run build` as the build command and setting `dist` as the directory should solve it.

---

<div class="post-metadata">

**Author:** ![learntocode](https://avatars.discourse-cdn.com/v4/letter/l/45deac/32.png) [@learntocode](https://answers.netlify.com/u/learntocode)\
**Post date:** [January 26, 2024, 6:56pm UTC](https://answers.netlify.com/t/netlify-throws-404-error-on-deploy-for-vite-tried-redirect-tried-adding-netflify-toml-nothing-works/111123/7 "2024-01-26T18:56:48Z")

</div>

Hi Hrishikesh,

I tried adding npm run build and dist to the configuration for deployment and now it fails to deploy

![image](https://global.discourse-cdn.com/netlify/original/3X/c/a/ca5a593ee782fc78718949c9aba76455ec08f274.png)

My netlify.toml is in the root

---

<div class="post-metadata">

**Author:** ![learntocode](https://avatars.discourse-cdn.com/v4/letter/l/45deac/32.png) [@learntocode](https://answers.netlify.com/u/learntocode)\
**Post date:** [January 26, 2024, 6:57pm UTC](https://answers.netlify.com/t/netlify-throws-404-error-on-deploy-for-vite-tried-redirect-tried-adding-netflify-toml-nothing-works/111123/8 "2024-01-26T18:57:19Z")

</div>

![image](https://global.discourse-cdn.com/netlify/original/3X/0/7/07c19485b306276f1810e2b3bbaf0d758e3e04db.png)

---

<div class="post-metadata">

**Author:** ![hrishikesh](https://sea1.discourse-cdn.com/netlify/user_avatar/answers.netlify.com/hrishikesh/32/74607_2.png) [@hrishikesh](https://answers.netlify.com/u/hrishikesh)\
**Post date:** [January 26, 2024, 7:04pm UTC](https://answers.netlify.com/t/netlify-throws-404-error-on-deploy-for-vite-tried-redirect-tried-adding-netflify-toml-nothing-works/111123/9 "2024-01-26T19:04:36Z")

</div>

I’d suggest you to read your logs 🙂

None of the problems you’ve faced so far have anything to do with Netlify, yet you called out Netlify being a problem in your first message. Your current problem is:

 ![image](https://global.discourse-cdn.com/netlify/original/3X/6/3/63f2e3aa5bdb04f26dce4b6988d326d124b4b5e6.png)

I think the problem is fairly self-explanatory, but if not it means your package.json doesn’t have any `build` command. Looking at the file structure you’ve shared, your files seem to be in the client folder, so maybe you need to set your base directory to `client`.

---

<div class="post-metadata">

**Author:** ![learntocode](https://avatars.discourse-cdn.com/v4/letter/l/45deac/32.png) [@learntocode](https://answers.netlify.com/u/learntocode)\
**Post date:** [January 26, 2024, 8:19pm UTC](https://answers.netlify.com/t/netlify-throws-404-error-on-deploy-for-vite-tried-redirect-tried-adding-netflify-toml-nothing-works/111123/10 "2024-01-26T20:19:01Z")

</div>

My package.json has build is:

“scripts”: {  
“dev”: “vite”,  
“build”: “vite build”,  
“lint”: “eslint . --ext js,jsx --report-unused-disable-directives --max-warnings 0”,  
“preview”: “vite preview”  
},

Also tried setting my directory to client  
 ![image](https://global.discourse-cdn.com/netlify/original/3X/4/0/40fdb77dbbcdac1b2a7de3f2bd9f01ba3baa5d24.png)

The logs keep giving me the same build error.

Also tried making my package.json build command CI=“npm run build”

---

<div class="post-metadata">

**Author:** ![dig](https://sea1.discourse-cdn.com/netlify/user_avatar/answers.netlify.com/dig/32/56744_2.png) [@dig](https://answers.netlify.com/u/dig)\
**Post date:** [January 26, 2024, 11:27pm UTC](https://answers.netlify.com/t/netlify-throws-404-error-on-deploy-for-vite-tried-redirect-tried-adding-netflify-toml-nothing-works/111123/11 "2024-01-26T23:27:07Z")

</div>

> [@learntocode](#):
>
> Also tried setting my directory to client

It would appear you haven’t followed @hrishikesh’s advice @learntocode

> [@hrishikesh](#):
>
> set your base directory to `client`.

But looking at the screenshot above you set the _package directory_ to `client`, not the _base directory_.

---

<div class="post-metadata">

**Author:** ![nathanmartin](https://sea1.discourse-cdn.com/netlify/user_avatar/answers.netlify.com/nathanmartin/32/30845_2.png) [@nathanmartin](https://answers.netlify.com/u/nathanmartin)\
**Post date:** [January 27, 2024, 5:17am UTC](https://answers.netlify.com/t/netlify-throws-404-error-on-deploy-for-vite-tried-redirect-tried-adding-netflify-toml-nothing-works/111123/12 "2024-01-27T05:17:46Z")

</div>

@learntocode The answer has been supplied by both @hrishikesh and @dig

If you read the definitions of those values in the documentation it reveals why it hasn’t worked for you:

> **[Build configuration overview](https://docs.netlify.com/configure-builds/overview/#definitions)**
>
> Configure build settings for a repository that uses continuous deployment, and understand build image options for your site.

The main issue being that your project is actually in the `client` folder.

You should only need to set the **Base directory** in the Netlify UI as `client`, at which point Netlify will find the `netlify.toml` file you have in that folder and proceed with the configuration in that file.

You would obviously need to make sure that configuration is also correct.

---

<div class="post-metadata">

**Author:** ![learntocode](https://avatars.discourse-cdn.com/v4/letter/l/45deac/32.png) [@learntocode](https://answers.netlify.com/u/learntocode)\
**Post date:** [January 27, 2024, 8:34pm UTC](https://answers.netlify.com/t/netlify-throws-404-error-on-deploy-for-vite-tried-redirect-tried-adding-netflify-toml-nothing-works/111123/13 "2024-01-27T20:34:18Z")

</div>

When I did exactly @hrishikesh and @dig suggested and it keeps telling me it can’t find the base directory. It will only find the base directory if I leave the netlify settings for base as “/” but modify the toml file only:

[build]  
command = “vite build”  
publish = “client/dist”  
base = “client”

I tried with npm run build and it still wont’ find the build script so I changed my toml file and the netifly settings to vite build. It still cannot find the build script

 ![image](https://global.discourse-cdn.com/netlify/original/3X/3/b/3b91a052d1e865114f8148b0849807935339c33f.png)

---

<div class="post-metadata">

**Author:** ![dig](https://sea1.discourse-cdn.com/netlify/user_avatar/answers.netlify.com/dig/32/56744_2.png) [@dig](https://answers.netlify.com/u/dig)\
**Post date:** [January 27, 2024, 9:50pm UTC](https://answers.netlify.com/t/netlify-throws-404-error-on-deploy-for-vite-tried-redirect-tried-adding-netflify-toml-nothing-works/111123/14 "2024-01-27T21:50:48Z")

</div>

In the UI you have have set the _base directory_ as `/`, is that correct @learntocode?

And then the `netlify.toml` file is in `client` and in this file you have set the base as `client`?

So looking at the [File-based configuration](https://docs.netlify.com/configure-builds/file-based-configuration/) documentation I see

> The `netlify.toml` is normally stored in the root of your site repository.

and then

> All paths configured in the `netlify.toml` should be absolute paths relative to the [base directory](https://docs.netlify.com/configure-builds/overview/#definitions), which is the root by default (`/`).

It would appear you are not follow the documentation. As @nathanmartin explained, the solution to _your issue_ is clearly outlined in previous posts and in the documentation.

---

<div class="post-metadata">

**Author:** ![learntocode](https://avatars.discourse-cdn.com/v4/letter/l/45deac/32.png) [@learntocode](https://answers.netlify.com/u/learntocode)\
**Post date:** [January 27, 2024, 11:07pm UTC](https://answers.netlify.com/t/netlify-throws-404-error-on-deploy-for-vite-tried-redirect-tried-adding-netflify-toml-nothing-works/111123/15 "2024-01-27T23:07:16Z")

</div>

Was able to resolve this by removing an extra folder layer below the root. Thanks everyone!

---

<div class="post-metadata">

**Author:** ![SamO](https://sea1.discourse-cdn.com/netlify/user_avatar/answers.netlify.com/samo/32/41847_2.png) [@SamO](https://answers.netlify.com/u/SamO)\
**Post date:** [January 29, 2024, 3:50pm UTC](https://answers.netlify.com/t/netlify-throws-404-error-on-deploy-for-vite-tried-redirect-tried-adding-netflify-toml-nothing-works/111123/16 "2024-01-29T15:50:13Z")

</div>

Awesome. Thanks for coming back and sharing your solution. Glad you got your site up and running! 👍🏿
