前端使用react开发，通过create-react-app搭建react环境，通过npm run build生成的 build目录，使用nginx做为代理服务器。

项目在本地开发时，没有任何问题，部署到服务器上出现了2个问题。

问题一：开发的应用是单页面应用，从主页一步一步点击没有问题，一旦刷新或者直接在地址栏输入，都会出现报错，显示的是404，无法找到页面。

问题二：解决404后，刷新或者直接在地址栏输入，查看控制台提示：Uncaught SyntaxError: Unexpected token <，页面空白依然没有正常渲染出界面。

问题一：

路由使用了BrowserRouter ： import { BrowserRouter as Router } from 'react-router-dom';

当请求https://www.ohlaa.com/xxx时，会到nginx下面找到该路径，然后加载index.html。现在切换到路由https://www.ohlaa.com/xxx/home，刷新页面后，实际请求的是xxx目录下home项目里的index.html，因此报错404。

解决方案1是：使用HashRouter 替换BrowserRouter ，缺点就是地址栏出现了#，看着不太爽。

import { HashRouter as Router, Route, Link } from 'react-router-dom';

解决方案2是：继续使用BrowserRouter ，但是要配置nginx服务器。

`    server {
    listen       80; #默认端口 也就是用户请求网站首页时使用的
    server_name  127.0.0.1 www.ohlaa.com;
    root /data/build;#项目前端使用 npm run build 命令生成的dist/build文件夹
    index index.html;
    location / {
      try_files $uri /index.html;
    }`

问题二：

问题一解决后，出现了第二个问题。页面依然渲染不出来，因为使用npm run build生成的build目录。原因就是生成的index.html引用的js文件路径不对。

<script src="./static/js/main.2a806527.chunk.js"></script>

多出来一个’.’，此时突然想起来，刚开始使用react的时候在package.json添加了一行代码"homepage": “.”。

修改为网站的网址"homepage": “http://www.qwe.com”，问题解决。