Vue+springboot independent deployment under Windows

Two projects, vue and springboot, are deployed independently, and the front desk has used nginx for forwarding

Background packaged deployment

spring boot packaging

Find the package in the maven management on the far right of the compiler for background packaging.
Insert picture description here
Since this is an independent deployment, the package isjar包
Set the jar package or war package after packaging through pom,
Insert picture description hereand then find the jar package just packaged in the target folder (enter the project directory)
Insert picture description here
Insert picture description here

Deploy and run

Then put the jar on the server and use the cmd window (the path must be switched to the path where the jar package is placed) using the commandjava -jar xxx (jar package name)
Insert picture description here


Front-end package deployment

Package the vue project

Insert picture description here

Insert picture description hereThe dist folder is the file packaged in the foreground
Insert picture description here
Notes for packaging vue projects:
1. Without this on the server, there will be less static style
publicPath:'…/…/'
assetsPublicPath:'/',//Development use
Insert picture description hereInsert picture description here
Insert picture description here

Use Nginx to deploy the foreground

The version used here is 1.2.2
nginx download address
1. Move the files in the dist folder to the html folder of
Insert picture description here
nginx 2. Configure nginx
Open nginx.conf
Insert picture description herenginx.conf configuration content in the conf folder

#user  nobody;
worker_processes  1;

#error_log  logs/error.log;
#error_log  logs/error.log  notice;
#error_log  logs/error.log  info;

#pid        logs/nginx.pid;


events {
    worker_connections  1024;
}


http {
    include       mime.types;
    default_type  application/octet-stream;
client_max_body_size 8M;
client_body_buffer_size 128k;
fastcgi_intercept_errors on;
    #log_format  main  '$remote_addr - $remote_user [$time_local] "$request" '
    #                  '$status $body_bytes_sent "$http_referer" '
    #                  '"$http_user_agent" "$http_x_forwarded_for"';

    #access_log  logs/access.log  main;

    sendfile        on;
    #tcp_nopush     on;

    #keepalive_timeout  0;
    keepalive_timeout  65;

    #gzip  on;

    server {
        listen       8080;  #替换为监听服务器的端口号
        server_name  127.0.0.1 #替换为监听服务器的ip地址
        #添加头部信息
        proxy_set_header Cookie $http_cookie;
        proxy_set_header X-Forwarded-Host $host;
        proxy_set_header X-Forwarded-Server $host;
        proxy_set_header X-Forwarded-For $proxy_add_x_forwarded_for;

        #charset koi8-r;

        #access_log  logs/host.access.log  main;
         #这里与vue开发环境下的配置代理一样
         #生产环境下的代理地址
        location ^~ /api/{ #xx
            proxy_pass http://127.0.0.1:8081/;
       }
        location ^~ /city/{ #xx
            proxy_pass http://127.0.0.1:9000/;
       }
        location / {
            root   dist;
            index  index.html index.htm;
        }

        
        #error_page  404              /404.html;

        # redirect server error pages to the static page /50x.html
        #
        error_page   500 502 503 504  /50x.html;
        location = /50x.html {
            root   html;
        }

        # proxy the PHP scripts to Apache listening on 127.0.0.1:80
        #
        #location ~ \.php$ {
        #    proxy_pass   http://127.0.0.1;
        #}

        # pass the PHP scripts to FastCGI server listening on 127.0.0.1:9000
        #
        #location ~ \.php$ {
        #    root           html;
        #    fastcgi_pass   127.0.0.1:9000;
        #    fastcgi_index  index.php;
        #    fastcgi_param  SCRIPT_FILENAME  /scripts$fastcgi_script_name;
        #    include        fastcgi_params;
        #}

        # deny access to .htaccess files, if Apache's document root
        # concurs with nginx's one
        #
        #location ~ /\.ht {
        #    deny  all;
        #}
    }


    # another virtual host using mix of IP-, name-, and port-based configuration
    #
    #server {
    #    listen       8000;
    #    listen       somename:8080;
    #    server_name  somename  alias  another.alias;

    #    location / {
    #        root   html;
    #        index  index.html index.htm;
    #    }
    #}


    # HTTPS server
    #
    #server {
    #    listen       443 ssl;
    #    server_name  localhost;

    #    ssl_certificate      cert.pem;
    #    ssl_certificate_key  cert.key;

    #    ssl_session_cache    shared:SSL:1m;
    #    ssl_session_timeout  5m;

    #    ssl_ciphers  HIGH:!aNULL:!MD5;
    #    ssl_prefer_server_ciphers  on;

    #    location / {
    #        root   html;
    #        index  index.html index.htm;
    #    }
    #}

}

3. Double-click nginx.exe to run

Guess you like

Origin blog.csdn.net/weixin_44383354/article/details/112962032