一, 打包react项目

1,在工作空间目录下create-react-app test-arrange 创建项目test-arrange

2,在新建的项目中写好请求与页面

3,打包, 在项目目录下 npm run build

打包完成之后, 在项目目录下出现build文件夹。

二, 下载安装Windows版Nginx

1,Nginx下载地址http://nginx.org/en/download.html

下载的是稳定版1.16.1

2,解压

3,将步骤一中打包后生成的build文件夹内文件复制到nginx -> html目录下[不一定是html目录,可以在nginx.conf中修改;location/里面的root]

4,修改nginx -> conf目录下配置文件nginx.conf

PS: 如果步骤一的2和步骤二的4中不加api访问后台接口的时候会报404

5,启动Nginx, 在nginx目录下 start nginx

6,访问, http://localhost:8081,因为是Windows版的nginx所以是localhost,如果nginx是在Linux服务器上,localhost改为相应ip地址

点击search,可以从后台取到数据

7,停止nginx, 在nginx目录下nginx -s quit

Windows版:Nginx部署React项目并访问Spring Boot后台数据的更多相关文章

  1. nginx部署h5项目

    1. nginx部署h5项目 此为windows部署,liunx也类似的 1.1. 前言 部署h5项目还是很简单的,不过对小白来讲一开始可能也是一脸懵逼,这个简单教程针对的是从未部署过前后端分离前端项 ...

  2. nginx部署vue项目

    nginx是一个高性能的HTTP和反向代理服务器.因此常用来做静态资源服务器和后端的反向代理服务器.本文主要记录使用nginx去部署使用vue搭建的前端项目,项目基于vue官方的脚手架vue-cli构 ...

  3. 小白从零开始阿里云部署react项目+node服务接口(三:部署到服务器)

    服务器 准备工具 依次安装即可 nginx 安装nginx https://www.runoob.com/linux/nginx-install-setup.html 配置全局nginx命令 http ...

  4. 使用uWSGI+nginx部署Django项目

    最近使用django写了一些项目,不过部署到服务器上碰到一些问题,还有静态文件什么的一堆问题,这里总结一下碰到的问题和解决方案,总体思路是按照官方文档走的. 原文地址:http://uwsgi-doc ...

  5. 服务器nginx部署PHP项目样式不出来要注意的小问题

    服务器使用nginx部署PHP项目的时候如果样式没有 出来,那么很可能 location 块里出问题了. 比如 location / { root /home/wwwroot/default/php_ ...

  6. 通过Nginx部署flask项目

    用Flask开发之后,很多人,喜欢用nohup python manage.py & 这样的形式,放到后台运行,其实这样只是个发开模式,很简陋,无法支持并发,进程监控等功能.所以采用nginx ...

  7. 小白从零开始阿里云部署react项目+node服务接口(二:node服务+web)

    我们用极简的方式来创建服务,没有任何附加功能 1 新建一个server文件夹 2 使用npm init 或者yarn init  一路enter 3  yarn add  express cors  ...

  8. 小白从零开始阿里云部署react项目+node服务接口(一:阿里云服务器)

    准备阿里云服务器,并安装系统 如果没用自己服务器可以购买一个 https://www.aliyun.com/minisite/goods?userCode=x7i5glgc 初级购买一个1核2G的主机 ...

  9. Windows下Nginx配置SSL实现Https访问(包含证书生成)

    Vincent.李   Windows下Nginx配置SSL实现Https访问(包含证书生成) Windows下Nginx配置SSL实现Https访问(包含证书生成) 首先要说明为什么要实现https ...

随机推荐

  1. 下拉框等需要显示上下箭头切换的CSS样式

    下拉框等需要显示上下箭头切换的CSS样式   .icon-right, .icon-down, .icon-up { display: inline-block; padding-right: 13r ...

  2. Solr基础知识三(整合SSM)

    前两篇讲了solr安装和导入数据,这篇讲如何整合到SSM中. 一.整合SSM 1.1 引入依赖 1.2 初始化solr 1.3 写service 1.4 写控制层 1.5 查询 二.IK分词器 2.1 ...

  3. ML-求解 SVM 的SMO 算法

    这算是我真正意义上认真去读的第一篇ML论文了, but, 我还是很多地方没有搞懂, 想想, 缓缓吧, 还是先熟练调用API 哈哈 原论文地址: https://www.microsoft.com/en ...

  4. memcached的安装和学习

    linux下安装memcached 第一首先要安装 libvevent ,用 rpm -qa | preg libevent  ,用 which libevent  查看安装路径 以下图解:     ...

  5. 接触手机脚本编程------基于触动精灵的lua编程

    Auto.js好用多了,还不用root直接能用,我为什么学这个呢..... 最近因为学习需要开始接触一门新的脚本语言,我更深刻的发现了,语言只是一种工具,重要的是解决问题的思维,由于这次是需要我快速掌 ...

  6. 92. 反转链表 II.反转从位置 m 到 n 的链表。请使用一趟扫描完成反转。

    public ListNode reverseBetween(ListNode head, int m, int n) { ListNode dummy = new ListNode(0); //虚拟 ...

  7. 【转】大众点评CAT开源监控系统剖析

    https://www.cnblogs.com/yeahwell/p/cat.html 参考文档: 大众点评的实时监控系统分析(一) CAT_source_analyze 透过CAT,来看分布式实时监 ...

  8. Git推送文件时,出现的Couldn't load this key(OpenSSH SSH-2 private key (old PEM format))

    在进行推送到远程仓库的过程中遇到的一个错误. 解决方法: 找到这个位置 然后打开文件所在位置 再打开这个文件然后再 导入成功 然后点击save private key这个按钮 就可以成功的生成一个文件 ...

  9. ArcGIS 10.2 JavaScript API本地部署离线开发环境

    1 获取ArcGIS JavaScript API API的下载地址http://support.esrichina.com.cn/2011/0223/960.html,在下载页面会看到api和sdk ...

  10. Mac下用命令行获取苹果手机的UDID

    在终端输入命令行:system_profiler SPUSBDataType | grep "Serial Number:.*" | sed s#".*Serial Nu ...