import{_ as i}from"./split-1-1db7d146.js";import{_ as c,r as t,o as l,c as o,b as n,d as s,e as p,a}from"./app-4f4af2d5.js";const d={},r=a('

前后端分离

提示

项目采用的是前后端分离的模式开发，前端一般采用 nginx 部署 vue 代码

1、首先确认前端代码 打包基础目录是否正确

下图中 /client/ 代表打包后代码文件必须在一个 client 目录下

配置打包路径

2、打包前端代码

打包后的前端代码，位于 dist 文件夹中

npm run build

3、将打包后的代码放到 nginx 的 html 目录下

例如：/usr/local/nginx/html/client 这里的 client 目录根据你代码配置 /client/ 而定

4、配置 nginx

下面是一个简单的 nginx 配置，如果你不会配置 nginx 请自行百度 或者 GPT

    server {
        listen       1088;#客户端访问端口
        server_name  localhost;#客户端访问域名  Nginx服务器的地址

        #charset koi8-r;

        #access_log  logs/host.access.log  main;#   

        location / {
            root   html;
            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;
        #}
    }

5、重启 nginx

`,14),m={href:"http://localhost:1088",target:"_blank",rel:"noopener noreferrer"},v=a(`
sudo service nginx restart
`,1);function u(k,h){const e=t("ExternalLinkIcon");return l(),o("div",null,[r,n("blockquote",null,[n("p",null,[s("重启 nginx 服务，访问 "),n("a",m,[s("http://localhost:1088"),p(e)]),s(" 即可看到前端页面")])]),v])}const _=c(d,[["render",u],["__file","split.html.vue"]]);export{_ as default};