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 重启服务器

文件目录如下

访问地址效果如下:

相关推荐
2301_816374337 小时前
服务访问的用户认证
前端·网络
XS0301067 小时前
从浏览器到互联网的完整数据流
前端·数据库·servlet·交互
hhb_6187 小时前
MATLAB数值计算与数据可视化核心技术梳理及实战应用案例解析
前端
lichenyang4537 小时前
从零理解微前端:基于 React + Vite + qiankun 的子应用切换 Demo
前端·react.js·状态模式
2601_957780847 小时前
AI智能体时代:为什么HTML正在取代Markdown成为新一代输出标准
大数据·前端·人工智能·gpt·html·claude
2301_815279528 小时前
如何实现C++ Web 自动化测试实战:常用函数全解析与场景化应用指南
开发语言·前端·c++
代码不停8 小时前
Spring Web MVC
前端·spring·mvc
倾颜14 小时前
从 textarea 到 AI 输入框:用 Tiptap 实现 / 命令、@ 引用和结构化请求
前端·langchain·next.js
kyriewen15 小时前
程序员连夜带团队跑路,省了23万:这AI太贵,真的用不起了
前端·javascript·openai
kyriewen16 小时前
你写的代码没有测试,就像出门不锁门——Jest + Testing Library 从入门到不慌
前端·单元测试·jest