Reactjs 部署react router redux以解决IIS问题_Reactjs_Iis_Webpack_React Router_React Redux

Reactjs 部署react router redux以解决IIS问题

reactjs iis webpack

Reactjs 部署react router redux以解决IIS问题,reactjs,iis,webpack,react-router,react-redux,Reactjs,Iis,Webpack,React Router,React Redux,我无法使我的生产版本在IIS上运行。应用程序似乎加载了资源（bundle.js和bundle.css），但显示了一个空白页面。浏览器中没有错误。我不清楚问题在哪里，也不清楚如何调试它我正在使用： React 15.3.1 react路由器3 redux 3.2.1 webpack 1.12.11 正在加载源：我的代码当前设置如下： index.html <html> <head> <meta charset="utf-8">

我无法使我的生产版本在IIS上运行。应用程序似乎加载了资源（bundle.js和bundle.css），但显示了一个空白页面。浏览器中没有错误。我不清楚问题在哪里，也不清楚如何调试它

我正在使用：

```
React 15.3.1
```
```
react路由器3
```
```
redux 3.2.1
```
```
webpack 1.12.11
```

正在加载源：

我的代码当前设置如下：

index.html

    <html>
    <head>
    <meta charset="utf-8">
    <title>MyApp</title>
    <meta name="description" content="">
    <meta name="viewport" content="width=device-width, initial-scale=1">
    <link rel="shortcut icon" type="image/png" href="/src/images/favicon.png"/>
    <link rel="stylesheet" type="text/css" href="./dist/bundle.css"/>
    <link href='https://fonts.googleapis.com/css?family=Roboto:400,300,500' rel='stylesheet' type='text/css'>

</head>

<body>
<div id="root"></div>
</body>

<script src="./dist/bundle.js"></script>

</html>

index.js

从“React”导入React；
从“react dom”导入react dom；
从'react redux'导入{Provider}；
从“react Router”导入{Router，Redirect，browserHistory}；
从“react-tap事件插件”导入injectTapEventPlugin；
从“react router redux”导入{syncHistoryWithStore}；
从“/store/configureStore”导入configureStore；
从“./routes”导入路由；
导入“/style.scss”；
require（'expose？$！expose？jQuery！jQuery'）；
需要（“引导-网页包”）；
injectTapEventPlugin（）；
const store=configureStore（）；
const history=syncHistoryWithStore（浏览器历史记录，存储）；
ReactDOM.render(
{routes}
,
document.getElementById（'root'），
);

routes.js

从“React”导入React；
从“反应路由器”导入{Route}；
从“./containers/App”导入{App}；
从“./containers/MapContainer”导入{MapContainer}；
导出默认值(
);

您是否尝试过清除缓存？我看到你的bundle.js没有版本，因此如果你以前部署过代码，那么浏览器有时不会加载新代码，因为它认为新代码已经缓存。@WenHaoWu是的，我已经清除了缓存，但不是在每次测试之后。我确实使用了Chromes隐姓埋名模式，这应该有同样的效果，对吧？我会检查Chrome控制台，看看是否一切都在那里，只是为了确定。我通常先检查元素以确保脚本标签指向正确的路径，然后检查源标签以确保您也有。/dist/bundle.js。@WenHaoWu谢谢我上传了一张图片，显示bundle.js和css正在Chrome控制台的源标签中加载。我不确定这是否相关，但是我将我的bundle脚本标记放在标记内，而您在index.html中将它放在标记外。

<?xml version="1.0" encoding="UTF-8"?>
<configuration>
  <system.webServer>
  <rewrite>
    <rules>
      <rule name="ReactRouter Routes" stopProcessing="true">
        <match url=".*" />
        <conditions logicalGrouping="MatchAll">
          <add input="{REQUEST_FILENAME}" matchType="IsFile" negate="true" />
          <add input="{REQUEST_FILENAME}" matchType="IsDirectory" negate="true" />
        </conditions>
        <action type="Rewrite" url="index.html" />
      </rule>
    </rules>
  </rewrite>
</system.webServer>
</configuration>