react-BrowserRouter-nginx-二级目录配置

我的域名假设是http://www.abc.cn，二级目录是wsp；

前端两步：

第一步：package.json下加homepage字段：

    正确写法："homepage": "http://www.abc.cn/wsp/",

    注意：这里一定要是绝对路径，我网上找了好多都是
    方案1："homepage": "."
    方案2："homepage": "./"
    方案3：改node-module下面的react-script的。
    我都一一尝试过了，all ends no effect.

    配图加强理解：
    

第二步：

    在BrowserRouter元素里面加basename属性
    正确写法<BrowserRouter basename='/wsp/'>....</BrowserRouter>  

    配图加强理解：  
    

 

后端一步：

后端配置找后端人员或者运维人员

   项目简单的话：复制下面这段代码到nginx配置里。

location / {
	#index index.html index.htm;
	try_files $uri /index.html;
}
location /wsp {
	try_files $uri $uri/ /wsp/index.html;
}

项目复杂的话：附赠公司大佬配置。

location /wsp/ {
   proxy_intercept_errors on;
   proxy_pass http://www.sina.com;#测试网址
   proxy_set_header Host $host; 
   proxy_set_header X-Forward-For $proxy_add_x_forwarded_for;
   error_page 404 = @wsp;
}
location @wsp {
   #try_files $uri /data/dali/tomcat-cluster/tomcat-9090/webapps/ROOT/wsp/;
   try_files $uri /wsp/index.html;
}