Question

我需要对反应路由器网站的运行做出反应，而不是将其提供给Web服务器，以便我的高层可以查看它。按照我的老板＆＃39;指令，我的任务是向他发送包含所有已编译的静态文件（js / css / img）的index.html文件，以便加载它，以便他们查看我的工作。

我已经告诉我的老板我可以向他发送package.json的网站，所以他只需要运行npm install来获取依赖项并运行脚本来启动开发服务器然而，他告诉我他必须把它呈现给那些没有安装node的人。我该怎么办？

Answer 1

使用react-router v4.x.x，您可以使用<HashRouter />

import { HashRouter } from 'react-router-dom'

<HashRouter>
  <App/>
</HashRouter>

了解更多信息see the following link

使用react-router v3.x.x使用hasHistory：

import React from 'react'
import { render } from 'react-dom'
import { hashHistory, Router, Route, IndexRoute } from 'react-router'

import App from '../components/App'
import Home from '../components/Home'

render(
  <Router history={hashHistory}>
    <Route path='/' component={App}>
      <IndexRoute component={Home} />
    </Route>
  </Router>,
  document.getElementById('app')
)

了解更多信息see the following link

您可以使用react-router加载react以及unpkg：

<script src="https://unpkg.com/react-router@4.2.0/umd/react-router.min.js"></script>

Answer 2

您可以尝试将"homepage": "."添加到项目package.json;这将指示反应脚本设置相对于index.html的所有路径。

当然，如果您的网站与服务器后端通信或具有客户端路由逻辑（如图所示），这将无法工作。 create-react文档提到react-router basename prop来修复客户端路由问题......

如何在不使用Web服务器的情况下加载React / React路由器站点？

2 个答案: