react + antd pro 项目搭建及发布流程

#antd Pro 项目环境搭建
##一、搭建项目
参考网址：https://pro.ant.design/docs/deploy-cn

###1、安装
从 GitHub 仓库中直接安装最新的脚手架代码。

$ git clone --depth=1 https://github.com/ant-design/ant-design-pro.git my-project

$ cd my-project

###2、安装依赖

$ npm install
如果网络状况不佳，可以使用 cnpm 进行加速。

####3、运行

$ npm start

##二、配置本地代理
###1、cnpm install nginx
###2、修改nginx.conf文件内容为

server {
    listen 80;
    # gzip config
    gzip on;
    gzip_min_length 1k;
    gzip_comp_level 9;
    gzip_types text/plain application/javascript application/x-javascript text/css application/xml text/javascript application/x-httpd-php image/jpeg image/gif image/png;
    gzip_vary on;
    gzip_disable "MSIE [1-6]\.";

    root /usr/share/nginx/html;

    location / {
        # 用于配合 browserHistory使用
        try_files $uri $uri/ /index.html;

        # 如果有资源，建议使用 https + http2，配合按需加载可以获得更好的体验 
        # rewrite ^/(.*)$ https://preview.pro.ant.design/$1 permanent;

    }
    location /api {
        proxy_pass https://preview.pro.ant.design;
        proxy_set_header   X-Forwarded-Proto $scheme;
        proxy_set_header   Host              $http_host;
        proxy_set_header   X-Real-IP         $remote_addr;
    }
}
server {
  # 如果有资源，建议使用 https + http2，配合按需加载可以获得更好的体验 
  listen 443 ssl http2 default_server;

  # 证书的公私钥
  ssl_certificate /path/to/public.crt;
  ssl_certificate_key /path/to/private.key;

  location / {
        # 用于配合 browserHistory使用
        try_files $uri $uri/ /index.html;

  }
  location /api {
      proxy_pass https://preview.pro.ant.design;
      proxy_set_header   X-Forwarded-Proto $scheme;
      proxy_set_header   Host              $http_host;
      proxy_set_header   X-Real-IP         $remote_addr;
  }
}

###3、修改config.js文件，添加以下代码

proxy: {
   '/api/': {  //匹配所有以/api/为开头的接口
     target: 'http://192.168.1.191:8080/', //后端服务器地址
     changeOrigin: true,  
     pathRewrite: { '^/api/': '' },  //因为我们项目的接口前面并没有api 所以直接去掉
   },
 },

##三、项目构建发布
1、打包项目为dist文件

$ npm run build

2、发布
然后将编译之后的文件复制到 spring boot 项目的 /src/main/resources/static 目录下。
重新启动项目，访问 http://localhost:8080/ 就可以看到效果。