动态导入无法在netlify中工作（reactjs）

Question

我正在尝试部署使用@ babel / plugin-syntax-dynamic-import的reactjs应用程序，该应用程序在我的localhost上运行正常，但是当我在netlify上部署它时，只有根URL工作（例如：mysite.netlify。 com），所有其他url与slug（例如：mysite.netlify.com/Visit）不起作用，它只返回404页面找不到，即使我已经定义了路由并在我的localhost上工作。

我在.babelrc文件中有以下设置

{
    "presets": ["@babel/preset-env", "@babel/preset-react"],
    "plugins": ["@babel/plugin-syntax-dynamic-import"]
} 

在我的package.json中

"dependencies": {
    "@babel/plugin-syntax-dynamic-import": "^7.2.0",
    ...
}

我在我的App.js上有以下导入

import React, { Suspense, lazy } from 'react';
import { BrowserRouter as Router, Route, Switch, Redirect } from 'react-router-dom';

const Photography = lazy(() => import('../Form1/Main.js'));
const Visit = lazy(() => import('../Form2/Main.js'));

是否有任何遗漏或我需要使它在netlify上工作？

Answer 1

我不认为这是动态导入的问题 - 这是Netlify配置的问题。 将_redirects文件添加到项目的公共根目录。 具有以下内容：

/*    /index.html   200

更多信息在这里

另一种方法是添加netlify.toml文件，但这更复杂，并且会获得相同的结果。 更多信息在这里