如何配置Office-js excel react加载项以使用react-router-dom或替代解决方案？

Question

因此，我试图使用react（使用在此处https://github.com/OfficeDev/generator-office中找到的yeoman office-js生成器）设置Office-js excel加载项，并且遇到了将加载项配置为使用多个路由的问题。看起来传统的React路由似乎不是开箱即用的（当前正在尝试使用react-router-dom）。有人知道我会怎么做吗？特别是，希望了解如何配置某种路由，webpack.config.js和manifest.xml。

例如，希望加载，例如route = [baseUrl] /上的LandingComponent，以及[baseUrl] / signup上的SignupComponent。

对于常规的旧React，我想要做的看起来像这样

const Routes = () => (
  <div>
    <Route path="/" exact component={LandingComponent} />
    <Route path="/signup" exact component={SignupComponent} />
  </div>
)

我怀疑需要修改的关键代码可能涉及webpack.config.js（这是实际配置webpack的痛苦，不确定我是否需要与这个人打交道，]，

manifest.xml

<DefaultSettings>
    <SourceLocation DefaultValue="https://localhost:3000/taskpane.html"/>
</DefaultSettings>

[此外，我正在研究从上述URL中删除'.html'的操作（目标是该插件默认情况下应将登陆加载到'https://localhost:3000/'，并且您可以通过按钮导航到'[ C0]”，而默认情况下该插件当前正在加载“ https://localhost:3000/signup”）。

对不起呕吐这个词，在这方面还是很新的，不确定什么是不可能的！

Answer 1

BrowserRouter

import {
  HashRouter as Router,
  Switch,
  Route
} from "react-router-dom";


...
render() {
return (
<Router>
  <div>
    <Switch>
      <Route exact path="/main" component={Home} />
    </Switch>
  </div>
</Router>
);
}

提供了更多的见解。最终，用于维护导航位置历史的两个函数被设置为null：

This answer

并且当您尝试使用常规浏览器路由时，会抛出异常，因为这些功能不存在，而散列路由不会发生这种情况。