vue3 门户网站搭建2-ngnix
路由配好了,需要调试下 build 后是否可用,这时我们需要一个服务端来运行静态网页。
官网直接下载一个 windows 版本的 ngnix 即可:
http://nginx.org/en/download.html
下载解压后:

命令行到此路径,启动 ngnix:

默认 80 端口:

常用配置在 conf 文件夹下 nginx.conf 中:

location 即为入口文件夹及主界面,静态资源可以直接放入 html 文件夹中:

此时访问 80 端口即可获取前端界面:

但是切换到其他路由界面,就会出现访问不到的情况

这是因为单页面应用路由被服务器解析成了获取文件地址,所以会报 404 找不到。可以通过配置 解决:

再重启下 ngnix

稍等一下,再刷新界面即可

本机访问无误后,可以将端口暴露给局域网访问:
1、打开控制面板,找到防火墙,选择高级设置

2、入栈规则中,新建规则

3、选择端口,下一步

4、特定端口,80,下一步

5、一直下一步
6、最后添加名称,点击完成

7、可以看到已经添加好了

其他ip 访问一下,没有问题:

vue3 门户网站搭建2-ngnix的更多相关文章
- linux下网站搭建
我们知道windows网站搭建一般是:IIS+Asp+Sqlserver,而 linux网站搭建是:Apache+php+Mysql.两者之间个有千秋,但是为什么我们许多的门户网站搭建都选择linux ...
- 爬虫抓取5大门户网站和电商数据day1:基础环境搭建
最新想用爬虫实现抓取五大门户网站(搜狐.新浪.网易.腾讯.凤凰网)和电商数据(天猫,京东,聚美等), 今天第一天先搭建下环境和测试. 采用maven+xpath+ HttpClient+正则表达式. ...
- 外网主机访问虚拟机下的Web服务器_服务器应用_Linux公社-Linux系统门户网站
body{ font-family: "Microsoft YaHei UI","Microsoft YaHei",SimSun,"Segoe UI& ...
- 电商门户网站商品品类多级联动SpringBoot+Thymeleaf实现
在淘宝.京东等电商网站,其门户网站都有一个商品品类的多级联动,鼠标移动,就显示,因为前端不是我做的,所以不说明前端实现,只介绍后端实现. 搭建部署SpringBoot环境 配置文件配置: 开启了对Th ...
- PHPCMS V9轻松完成WAP手机网站搭建全教程
---恢复内容开始--- 应用PHPCMS V9轻松完成WAP手机网站搭建全教程 用PHPCMS最新发布的V9搭建了PHPCMS研究中心网站(http://www.17huiyi.net)完成后,有用 ...
- 基于Vue开发的门户网站展示和后台数据管理系统
基于Vue的前端框架有很多,这几年随着前端技术的官方应用,总有是学不完的前端知识在等着我们,一个人的精力也是有限,不可能一一掌握,不过我们学习很大程度都会靠兴趣驱动,或者目标导向,最终是可以以点破面, ...
- node.js express安装及示例网站搭建
1.首先肯定是要安装Node.JS windows cmd依次输入如下命令: cd C:\Program Files\nodejs\ npm install -g expressnpm install ...
- SharePoint Online 创建门户网站系列之定制栏目
前 言 SharePoint Online自带的库就带有二级页面和详细页面,也就是Allitems页面和DispForm页面,但是实在不够美观,尤其对于门户网站这一企业门面来说,更是无法接受. 下面, ...
- SharePoint Online 创建门户网站系列之创建栏目
前 言 SharePoint Online的栏目,简单描述即显示在首页上的各个模块信息,这里,我们主要介绍我们首页上的栏目,包括简介类型.新闻列表类型.图片类型: 下面,让我们开始在SharePoin ...
- SharePoint Online 创建门户网站系列之图片滚动
前 言 创建SharePoint Online栏目我们之前已经介绍过了,具体就是内容编辑器方式.自带WebPart方式和JavaScript读取后台数据前台做展示的三种: 但是,对于复杂的展示来说,这 ...
随机推荐
- Nginx10 Lua入门 + openresty
1 Idea中创建Lua项目 lua官网:https://www.lua.org/ 1.1 添加插件,重启idea 1.2 创建项目 file-New Project 1.3 创建lua文件 1.4 ...
- docker03-常用命令
1.docker基础命令 1.1docker启动 指令:service docker start 1.2查看状态 指令:service docker status 1.3重启docker 指令:ser ...
- Windows MongoDB的安装及配置图文说明(非常详细)
1.下载 MongoDB 预编译二进制包下载地址:https://www.mongodb.com/try/download/community 2.安装 1)选择接受许可协议,点击Next下一步: 2 ...
- C++_bind用法
1.bind函数 网络编程中, 经常要使用到回调函数. 当底层的网络框架有数据过来时,往往通过回调函数来通知业务层. 这样可以使网络层只专注于 数据的收发, 而不必关心业务 在c语言中, 回调函数的实 ...
- STM32F4寄存器初始化系列:时钟开启
1 static void RCC_Init(void) 2 { 3 RCC->APB1ENR|=1<<17; //使能串口2时钟 4 RCC->APB1ENR|=1<& ...
- python requests 最牛攻略
目录 安装 Reuqests HTTP 简介 什么是 HTTP HTTP工作原理 HTTP的9种请求方法 HTTP状态码 requests 快速上手 requests 发起请求的步骤 requests ...
- React中组件之间是如何通信的 react的组件通信方式有哪些
一.是什么 通信指的是发送者通过某种媒体 以某种格式来传递信息 到收信者以达到某个目的,广义上,任何信息的传递都是通信 二.如何通信? 组件传递的方式有很多种,根据传送者和接收者可以分为如下: 父组件 ...
- 关于vux-ui框架的scroller组件所踩的坑
这是我在做一个demo的一个上垃加载下拉刷新功能时所遇到的问题,由于伤了好一会脑筋,所以留下这篇笔记以供后续查询: 在上代码前建议在开发项目时不要优先选择vux这个框架,因为有一些常用的功能组件官方已 ...
- Charles基本操作指南
安装: 百度"charles",闭着眼睛安装. charles依赖于java,还需要安装java,怎么安装java,见我的另一篇博客. 破解 注册码:Registered Name ...
- MRI炎症和结构损伤指标对TNF拮抗剂治疗AS患者获持续缓解的预测价值
MRI炎症和结构损伤指标对TNF拮抗剂治疗AS患者获持续缓解的预测价值 EULAR2015; PresentID: OP0043 PREDICTORS OF SUSTAINED REMISSION O ...