1、前端打包 首先配置前端环境.env.preview文件中VUE_APP_API_BASE_URL指向后端地址 之后,使用命令 yarn run build 打包后前端根目录出现dict文件夹 yarn run build 或者 npm run build 1. 使用Nginx代理部署前端 -配置内容 server { listen 85; server_name localhost; location / { root "C:\前端打包存放位...
taskkill /f /t /im nginx.exe ok,nginx安装完毕,接下来就可以开始部署项目了—— 一、打包并移动vue项目 运行命令:npm run build 到前端项目目录下,找到<dist>文件夹。复制<dist>下的文件,粘贴至nginx根目录下的 二、修改配置文件nginx.conf 完成上一步后,打开我们的配置文件<nginx.conf>,找到<server>节点,...
我们npm run build出来的dist就是这个文件夹,拷贝这个就行了,目录结构如上图,但是打开有问题,白茫茫一片,一般都是找不到资源文件。 其一、build出来的dist中的index是不能直接打开的,打开需要部署到服务器,如:http-serve、nginx、apache、Tomcat等服务器,网上都可以下载,我用习惯http-serve、nginx。因为比较简单。
1.打包 npm run build 2.这个时候会生成一个dist目录 C:\Users\Administrator\PycharmProjects\myvue02\dist 3.将dist文件夹上传到ngnix中的html目录中 /usr/share/nginx/html [root@dsc1 html]# ls 404.html 50x.html a.png dist en-US icons img index.html nginx-logo.png poweredby.png [root@dsc1 ...
-- 需要向后端请求的路径为:http://192.168.1.19:8087/(项目打包配置) 此时前端向后端发送请求一定会出现跨域!! 解决方法:启动nginx服务器,将server_name设置为127.0.0.1,然后设置响应的拦截前端需要跨域的请求相应的location以拦截前端需要跨域...
vue 部署到nginx 1、vue项目打包,获取dist目录 npm run build 2、配置nginx的server,同时配置代理服务。 3、重启nginx 先杀掉nginx进程 kill -QUIT $proccessID. 在启动nginx: nginx
1,项目打包。 需要注意的文件就两个。request.JS和vue.config.JS。 request.js文件 baseURL保持为空,会使用nginx统一配置,也可提前配置,但最终必须与nginx请求代理配置的识别字段保持一致。 vue.config.js文件 publicPath填写为你想区分项目的对应后缀字段
1.vue打包 npm run build 把dist目录下的文件拷贝到nginx相应目录下 2.nginx配置 vue代码部署到ng上默认是listen的端口80,请求后台服务器和端口需要配置下反向代理 server{listen80;#默认端口,前端会访问这个,下边做反向代理到服务端 server_name liangyb.top;location/{#默认根目录 root/usr/local/services/abcreg...
新项目是VUE3+VITE4做前端,后端是FastAPI,开发环境中前端访问后端正常,没有任何问题,打包部署到服务器上前端始终无法访问后端服务器,在网上查了很多资料,解决方法其实是有问题。现记录如下,备查。 一、前端配置的问题 前端vite.config.ts里的代理配置只适用开发环境,和正式环境无关!!
1.nginx安装 2.nginx启动 安装启动,此处不做介绍 3.vue打包 npm/yarn打包命令 最终生成dist文件包 4.nginx配置 若nginx配置过多,可以使用includ,主配置文件包含多个子配置文件 主配置nginx.conf worker_processes1;events{worker_connections1024;}http{includemime.types;default_type application/octet-stream;sendfile...