Question

我有一些路线的React应用程序，例如：

/ home
/常见问题解答
/ profile / 1
/ post / title-post-id-1

当url只有1级（/ home，/ faq，ecc）时，一切正常。

对于具有2个或更多级别（/ profile / 1或/ post / title-of-post-id-1）的url来说， index.html 文件已正确加载但是相关资源（js，css）无法加载，因为浏览器向服务器发送的路径错误的请求即

GET http://HOST/profile/resources/js/main.js

代替

GET http://HOST/resources/js/main.js

应用程序使用以下代码加载路由：

 <Route exact path="/" component={HomePage} />
     {Object.keys(loadableRoutes).map(path => {
         const { exact, ...props } = loadableRoutes[path]
         props.exact = exact === void 0 || exact || false // set true as default
         return <Route key={path} path={path} {...props} />
     })}

和

const loadableRoutes = {

    '/home': {
     component: loadable(() => import('/Home/homepage.js')),
     },
     '/profile/:uid': {
          component: loadable(() => import('/Profile/profile.js')),
          exact: true,
      }, 
      '/post/:posId': {
          component: loadable(() => import('/Post/post.js')),
          exact: true,
      },

如何为这些URL指示正确的“基本名称”属性？谢谢

Answer 1

我解决了将此行添加到“ index.html”的问题：

<base href="/">

反应：某些路由资源未正确加载

1 个答案: