英文:
Netlify and React Vite: Netlify says "Page not found" upon reloading in Vite and React site
问题
我在React JS中构建的网站中使用Vite作为JS捆绑工具。问题是，当我在Netlify上部署网站并重新加载页面时，它显示"页面未找到"。
我尝试修改vite.config.js文件。
import { defineConfig } from "vite";
import { resolve } from "path";
import react from "@vitejs/plugin-react";
// https://vitejs.dev/config/
export default defineConfig({
build: {
rollupOptions: {
input: {
main: resolve(__dirname, "index.html"),
},
},
},
plugins: [react()],
});
我还添加了.redirects文件。
请提供解决方案，我认为这是一个常见问题，但并没有得到很好的解决。
英文:
I have the site built in React JS where I am using Vite as a JS Bundler. The problem is, when I deployed the site on Netlify and when reloading the page it says "Page not found".
I tried adding changing vite.config.jsfile.
import { defineConfig } from "vite";
import { resolve } from "path";
import react from "@vitejs/plugin-react";
// https://vitejs.dev/config/
export default defineConfig({
build: {
rollupOptions: {
input: {
main: resolve(__dirname, "index.html"),
},
},
},
plugins: [react()],
});
I also added .redirects file.
Please provide a solution for this, I see this as a common issue but it hasn't been addressed much.
答案1
得分: 4
> 我认为这是一个常见问题，但没有得到很好的解决。
解决这个问题只能通过文档来实现，不幸的是，如果没有参考，就无法帮助。
没有看到您的网站和这个问题的描述，我只能“假设”您是在谈论刷新时出现的404问题，就像昨天发布的另一个类似问题：https://stackoverflow.com/questions/75375772/routes-not-working-properly-in-react-using-vite-on-build
解决方案在React文档中有记录（嗯，Create React App也有，但在这种情况下也适用）：https://create-react-app.dev/docs/deployment/#netlify
您需要创建一个文件，public/_redirects，内容如下：
/* /index.html 200
您已经提到您已经这样做了，但除非遵循上述的确切位置和语法，否则不会起作用。
英文:
> I see this as a common issue but it hasn't been addressed much.
Addressing this issue can only happen through documentation, which unfortunately if not referred to, cannot be helped.
Without seeing your site and the description of this being a common issue, I can only "assume" you're talking about the 404 on refresh problem, just like the another similar question posted about yesterday: https://stackoverflow.com/questions/75375772/routes-not-working-properly-in-react-using-vite-on-build
The solution is documented on React docs (well, Create React App, but valid in this case too): https://create-react-app.dev/docs/deployment/#netlify
You need to create a file, public/_redirects with the content:
/* /index.html 200
You already mention you've done that, but unless it follows the exact placement and syntax as above, it won't work.
通过集体智慧和协作来改善编程学习和解决问题的方式。致力于成为全球开发者共同参与的知识库，让每个人都能够通过互相帮助和分享经验来进步。
评论