Nginx部署前端项目尝试 - windows版

前端还是要学一点服务器端的东西,才能更好的理解一些知识

1、项目打包 生成dist
2、下载nginx解压,start nginx 启动

浏览器输入 localhost 显示如下页面表示启动成功

3、配置nginx
复制代码
	server {
        listen       8080;
        # ip 不要加http 前后不要加 /
        server_name  localhost;
		
		
        location / {    
            # 不知道为啥 data前面加/ 就报500
			root   data/dist;
			index  index.html index.htm;
            # history 路由模式要加如下代码
			try_files $uri $uri/ /index.html; 
        }
    }

我在nginx 目录下新建了 data 文件夹,dist放进此文件下 ./nginx -s reload 重启服务器

文件目录如下

访问地址效果如下:

相关推荐
雨雨雨雨雨别下啦几秒前
vant介绍
前端
小小小小宇几秒前
大模型失忆问题探讨
前端
wordbaby4 分钟前
rn-cross-calendar:一个兼容 React 18/19、RN/RNOH 的跨平台日历组件
前端·react native·harmonyos
weixin_523185326 分钟前
Collections.unmodifiableMap详解:真的不可修改吗?
java·linux·前端
江米小枣tonylua7 分钟前
关掉 VSCode:在 NeoVim12 上配置 Claude Code
前端·程序员
2301_7736436216 分钟前
ceph镜像
前端·javascript·ceph
程序员黑豆38 分钟前
AI全栈开发之Java:什么是JDK
前端·后端·ai编程
To_OC38 分钟前
万字解析《JS语言精粹》之第四章:函数15大核心精髓(JS灵魂核心)
前端·javascript·代码规范
mqcode1 小时前
Vue3 + Element Plus + Vite 企业级后台框架搭建全流程
前端
SL-staff1 小时前
Web 白板技术架构深度解析:从渲染到协作的选型哲学
前端·架构