React 为不正确的路径提供默认内容

Question

我使用 create-react-app 来玩 React。我注意到，无论我在 localhost:3000/（这是开发机器上的默认 url）之后输入什么，我总是从 localhost:3000

中获取内容

这意味着我无法访问图像，所以我真的不能用它做任何事情。

这是一个错误还是我只是不明白的一些很棒的新功能？如何关闭此功能？

Answer 1

你可以使用

render() {
  return <img src={process.env.PUBLIC_URL + '/img/logo.png'} />;
}

Answer 2

Create React App 使用 historyApiFallback 作为 webpack-dev-server，这意味着所有给出 404 响应的请求都将退回到加载 index.html 文件。

如果你将图像添加到 public 文件夹，您可以看到图像优先于 index.html 文件。

您还可以在 Webpack 的帮助下导入图像，并在您的代码中使用 import as src，Webpack 会确保图像最终出现在最终的 build 文件夹中.

import img from './image.png';

React serves default content for incorrect paths