nginx 关于vue打包项目配置

nginx 关于vue打包项目配置

nginx nginx.conf配置

#user  nobody; #配置worker进程运行用户
worker_processes  auto; #配置工作进程数目，根据硬件调整，通常等于CPU数量或者2倍于CPU数量
 
#error_log  logs/error.log; #配置全局错误日志及类型[debug | info | notice | warn | error | crit],默认是error
#error_log  logs/error.log  notice;
#error_log  logs/error.log  info;
 
#pid        logs/nginx.pid; #配置进程pid文件
 
#配置工作模式和连接数
events {
    worker_connections  1024; #配置每个worker进程连接数上限，nginx支持的总连接数就等于worker_processes * worker_connections
}
 
#配置http服务器,利用它的反向代理功能提供负载均衡支持
http {
    include       mime.types; #配置nginx支持哪些多媒体类型，可以再conf/mime.types查看支持哪些多媒体类型
    default_type  application/octet-stream;#默认文件类型
 
	#配置日志格式
    #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日志及存放路径，并使用上面定义的main日志格式
    #access_log  logs/access.log  main;
 
    sendfile        on; #开启高效文件传输模式
    #tcp_nopush     on; #防止网络阻塞
 
    #keepalive_timeout  0;
    keepalive_timeout  65; #长连接超时时间，单位是秒
 
    #gzip  on; #开启gzip压缩输出
 
	#配置虚拟主机
    server {
        listen       80; #配置监听端口
        server_name  localhost; #配置服务名
 
        #charset koi8-r; #配置字符集
 
        #access_log  logs/host.access.log  main; #配置本虚拟主机的访问日志
 
		#默认的斜杠/的请求，当访问路径中有斜杠/，会被该location匹配到并进行处理
        # location  / {
        #     root   /var/www/txys; #root是配置服务器的默认网站根目录位置，默认为nginx安装主目录的html目录
        #     try_files $uri $uri/ @router;
        #     index  index.html index.htm; #配置首页文件的名称
        # }

        location   /admin {         #vue 项目拦截到admin
            alias  /var/www/admin/; #root是配置服务器的默认网站根目录位置，默认为nginx安装主目录的html目录
             try_files $uri $uri/ /admin/index.html;
            index  index.html index.htm; #配置首页文件的名称
        }

  
         #以下服务器地址
        location /prod-api{       #vue  api 转发
            rewrite ^/prod-api/(.*) /$1 break;   #两个反斜杆
            proxy_pass http://localhost:8080/;          
        }

        # location /prod-api/ {
		# 	proxy_set_header Host $http_host;
		# 	proxy_set_header X-Real-IP $remote_addr;
		# 	proxy_set_header REMOTE-HOST $remote_addr;
		# 	proxy_set_header X-Forwarded-For $proxy_add_x_forwarded_for;
		# 	proxy_pass http://localhost:8080/;
		# }


        #error_page  404              /404.html; #配置404页面
 
        # redirect server error pages to the static page /50x.html
        #
        error_page   500 502 503 504  /50x.html; #配置50x错误页面
        location = /50x.html {
            root   html;
        }


		
		#PHP 脚本请求全部转发到Apache处理
        # proxy the PHP scripts to Apache listening on 127.0.0.1:80
        #
        #location ~ \.php$ {
        #    proxy_pass   http://127.0.0.1;
        #}
 
		#PHP 脚本请求全部转发到FastCGI处理
        # 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;
        #}
 
		#禁止访问 .htaccess 文件
        # 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服务，安全的网络传输协议，加密传输，端口443
    # 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;
    #    }
    #}
 
}

vue router/index.js 配置

export default new Router({
  base: '/admin/',
  mode: 'history', // 去掉url中的#
  scrollBehavior: () => ({ y: 0 }),
  routes: constantRoutes
})

vue .env.production 配置

VUE_APP_BASE_API = '/prod-api'