因为要把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/)需要注意的几点的更多相关文章

  1. 【深入nodejs开发】一、将node项目结合nginx部署到Centos7服务器

    一.安装nginx服务器环境 1.使用ssh工具连接服务器 2.安装宝塔面板,方便服务器管理 yum install -y wget && wget -O install.sh htt ...

  2. Linux上Nginx部署配置--二级域名配置

    http://www.cnblogs.com/yaunion/archive/2013/03/16/2962385.html http://blog.csdn.net/LBinin/article/d ...

  3. 在 .NET Core 5 中集成 Create React app

    翻译自 Camilo Reyes 2021年2月22日的文章 <Integrate Create React app with .NET Core 5> [1] Camilo Reyes ...

  4. 使用nginx部署项目的相关资料

    1.简单的利用nginx部署前端项目 2.ubuntu 下 Nginx 的安装和配置 3.nginx配置文件nginx.conf超详细讲解 4.Nginx 安装与部署配置以及Nginx和uWSGI开机 ...

  5. create react app 项目部署在Spring(Tomcat)项目中

    网上看了许多,大多数都是nginx做成静态项目,但是这样局限性太多,与Web项目相比许多服务端想做的验证都很麻烦,于是开始了艰难的探索之路,终于在不经意间试出来了,一把辛酸... 正常的打包就不说了. ...

  6. react+dva+antd项目构建

    一:版本升级 首先说明一下这里的dva是最新版: 2.3.2 1.初始化项目构建 npm install dva-cli -g dva -v dva-cli version 注:通过 npm 安装 d ...

  7. react实例:理解dva构建项目的原理

    请点击相应的步骤查看详情 我们首先搭建一个 dva Demo  项目(请参考react快速构建一个应用项目),然后逐步完成以下内容: 结构划分 设计 Model 组件设计方法 组件设计实践 添加 Re ...

  8. 转转hybrid app web静态资源离线系统实践

    一.前言 目前的转转app是一个典型的hybrid app,采用的是业内主流的做法: 客户端内有大量业务页面使用webview内加载h5页面承载. 其优点是显而易见的,即:web页面上线频度满足快速迭 ...

  9. 【前端】一步一步使用webpack+react+scss脚手架重构项目

    前言 前几天做了一个项目:[node]记录项目的开始与完成——pipeline_kafka流式数据库管理项目:因为开发时间紧迫,浅略的使用了一下react,感觉这个ui库非常的符合我的口味,现在趁着有 ...

随机推荐

  1. 3D图形引擎决定三维产业差异化

    从2009年中国3D产业初步兴起开始,短短几年间中国的3D技术得到了飞速的发展,3D打印机.3D投影仪.Web3D.虚拟现实.场景漫游等等产业应用应运而生,设备制造商和内容提供商都开始发挥自主创新的优 ...

  2. Selenium3+webdriver学习笔记3(xpath方式元素定位)

    #!/usr/bin/env python# -*- coding:utf-8 -*- from selenium import webdriver import time,os # about:ad ...

  3. AutoIt 脚本1

    一.新建的AU3 脚本进行编辑 选择Edit Script 如果是相运行脚本可以用Run Script 如果是想将脚本编译成.exe 可以用Compile Script 1)一个简单的AU3脚本 Ma ...

  4. 转 winfrom如何通过http来进行通信,并且通过传递json格式的数据可接受json格式的数据

    string username = this.textBox1.Text; string password = this.textBox2.Text; string AA = HttpUtility. ...

  5. [torch] torch.contiguous

    torch.contiguous 作用 连续存储,因为view的操作要求的是连续的内容. 详细 考虑下面的操作,transpose操作只是改变了stride,而实际数组存储的内容并没有得到任何改变,即 ...

  6. [学习笔记] Markdown语法备忘

    Markdown语法总结 标题 # 这是一级标题 ## 这是二级标题 ### 这是三级标题 #### 这是四级标题 ##### 这是五级标题 ###### 这是六级标题 注意#后面要加空格 字体 ** ...

  7. CentOS更改时区

    1.编辑文件 vi /etc/sysconfig/clock 修改内容 ZONE="Asia/Shanghai" 2.覆盖旧时区文件 cp /usr/share/zoneinfo/ ...

  8. bash编程之case语句,函数

    bash脚本编程:之case语句   条件测试: 0: 成功 1-255: 失败   命令: [ expression ] [[ expression ]] test expression   exP ...

  9. 二叉搜索树详解(Java实现)

    1.二叉搜索树定义 二叉搜索树,是指一棵空树或者具有下列性质的二叉树: 若任意节点的左子树不空,则左子树上所有节点的值均小于它的根节点的值: 若任意节点的右子树不空,则右子树上所有节点的值均大于它的根 ...

  10. WCF_基础学习

    1.https://www.cnblogs.com/swjian/p/8126202.html 2.https://www.cnblogs.com/dotnet261010/p/7407444.htm ...