Question

我正在尝试部署使用@ babel / plugin-syntax-dynamic-import的reactjs应用程序，该应用程序在我的本地主机上运行良好，但是当我在netlify上部署它时，只有根url有效（例如：mysite .netlify.com），所有其他带有slug的网址（例如：mysite.netlify.com/Visit）不起作用，即使我定义了路由并在本地主机上工作，它也只会返回未找到的404页面。

我的.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

更多信息here

一种替代方法是添加一个netlify.toml文件，但这更加复杂并且将获得相同的结果。更多信息here

动态导入在Netlify（React.js）中不起作用

1 个答案: