部署到 Netlify 时刷新页面返回空页面

Posted 2023-02-22

【中文标题】部署到 Netlify 时刷新页面返回空页面

【英文标题】：Refreshing page when deployed to Netlify returns empty page

【发布时间】：2019-09-26 06:40:15

【问题描述】：

我已通过 GitHub 将 create-react-app 站点的测试版部署到 Netlify（CD 主分支 - 存储库：https://github.com/willstocks-tech/ws-code-react）。

当我导航到该站点时，一切正常，我可以毫无问题地在 Home About 和 Contact 组件之间导航。

但是，当我在查看其中一个组件时刷新页面时，页面返回完全空白（在浏览器控制台中出现一些看似无关的错误）。

我在摆弄的过程中有什么遗漏的吗？请原谅任何新手错误，这是我在 React 的第一次正确尝试！

我尝试使用

创建一个 netlify.toml 文件

[[redirects]]
from = "/*"
to = "/index.html"
status = 200 

我还创建了一个 _redirects 文件（如建议的那样），如下所述。

这是我目前的设置：

index.js：

import React from 'react';
import ReactDOM from 'react-dom';
import App from './layout/App';
import './assets/stylesheets/index.scss';
//import * as serviceWorker from './serviceWorker';

//serviceWorker.unregister();

ReactDOM.render(<App />, document.getElementById('root'));

import React from 'react';
import  BrowserRouter as Router, Route, Switch  from 'react-router-dom';
import Navbar from './components/navbar';
import Home from 'layout/views/home';
import About from 'layout/views/about';
import Contact from 'layout/views/contact';
import Footer from './components/footer';


class App extends React.Component 
    constructor() 
        super();
    
    render() 
        return (
            <Router>
                <div className="app">
                    <Navbar />
                    <div className="view">
                        <Switch>
                            <Route exact path="/" component= Home />
                            <Route path="/about" component= About />
                            <Route path="/contact" component= Contact />
                            <Route render= () => <h1>404 Error</h1>  />
                        </Switch>
                    </div> /* view */
                    <Footer />
                </div> /* app */
            </Router>
        );
    


export default App;

使用当前只有一个 /public/_redirects 文件：

/*  /index.html  200

我希望能够向某人发送一个链接以说出 /about 或让某人刷新页面并查看相同/更新的内容，但目前他们只会看到一个空白页面。

【问题讨论】：

抱歉，我忘了附上一个链接，您可以在其中亲眼看到这种情况（总是更容易！）：jolly-knuth-71e083.netlify.com

【参考方案1】：

我有点傻...我忘了删除/public中的.html文件！

【讨论】：

你能解决它吗？

嗨@RiteshKarwa - 是的，我通过删除/public 文件夹中的所有.html 文件解决了这个问题。其中一个文件是预先存在的about.html。一旦删除，正确的（我的）页面就会出现！