creat-react-app/dva静态项目,用nginx部署在次级域名路径(如a.com/sub/)需要注意的几点

Posted 天师符

tags:

篇首语:本文由小常识网(cha138.com)小编为大家整理,主要介绍了creat-react-app/dva静态项目,用nginx部署在次级域名路径(如a.com/sub/)需要注意的几点相关的知识,希望对你有一定的参考价值。

因为要把dist文件夹部署在一个域名的次级目录,没想到和运维同学一起折腾了一下午。。

放在这里备忘,也给后来的同学一些可查的中文资料:

1,dva/cra给你的模板index.html是在public里面的,webpack会原封不动拷到dist,其中引入index.js和index.css都是绝对路径,可以用webpack ejs插件生成htmnl,因为我用了dva,不太想改webpack 配置太多,这里选用直接手去掉前缀/变成相对路径

2, 项目里面使用了react-i18next, locale文件是放到public里面的,配置locale初始化的时候根据环境变量修改下引入八戒影院目录是/还是/sub/

3,路由react-router匹配的prefix前缀

const browserHistory = useRouterHistory(createHistory)({
  basename: process.env.PUBLIC_PATH || ‘/‘,
})

如果是dva
import { createHistory } from ‘history‘
import { useRouterHistory } from ‘react-router‘

const app = dva({
  history: browserHistory,
});

4,webpack设置publickPath:/sub/

5,nginx配置:

 
server {
    listen 80;
    server_name www.abc.com;
    root /项目/root地址/不带sub;

    location /sub {
        try_files $uri $uri/ /sub/index.html;
    }
}

以上是关于creat-react-app/dva静态项目,用nginx部署在次级域名路径(如a.com/sub/)需要注意的几点的主要内容,如果未能解决你的问题,请参考以下文章

svn用Cornerstone上传项目丢失静态库.a问题的解决

VS编译linux项目生成静态库并在另一个项目中静态链接的方法

用ExpressMySQL搭建项目(接口以及静态文件获取文件上传等)

用nginx+Xshell+Xftp将静态项目部署到腾讯云服务器(超详细)

用Visual Studio2017写静态库

Eclipse Tomcat部署项目没有加载新加的静态资源文件