电脑的前端服务器开启

‘壹’ 电脑上,前端服务器在那开启

肯定首先要安装 vs code 和 node.js（既然是前端就必须回，不会的面壁思过）
然后在命令符中输入 npm install -g live-server 进行安装，（简单的NPM安装）
安装成功后在vscode里 “查看” - “集成终端”或者 文件夹命令提示符 里面输入 live-server ，

等待浏览器会自动打开 http://127.0.0.1:8080/ 这个端口。

‘贰’ 如何让本地的前端服务器访问本地的后台服务器

首行你要去注册一个花生壳帐号，这里就不写地址了，自己搜索一下。注册好后下载客户端，这个很重要，因为你要通过软件解析你的IP地址。如图

登录后，你就要去配置一下你的本地服务器软件了，现在常用的服务器组件有IIS，阿帕奇等，那今天我就用phpNOW这个做一下演示。

首先到网站上下载一个phpnow服务器软件，按照软件要求进行安装。（官方有提供教程）很简单的。
安装后打开PnCp.cmd 新增一下虚拟主机（或是你默认一下）通过localhost或127.0.0.1可以访问，那就说明你配置没有问题了

因为国内的ISP把80端口封闭了，所以你要用其它的端口，如图：这里我用2099这个端口，如果你有用路由器的话你要设置一下转发。（让路由器帮忙解析到指定内网服务器）这一步很重要。

之后你还要开放一下这个端口2099，右击网上邻居-属性-更改防火墙设置--例外-增加端口

5
设置好后，你就可以输入XXX域名：2099，或是127.0.0.1：2099这样就可以访问了，外网访问的时候一定要加上：2099端口号。

‘叁’ 前端搭建本地服务器

前端使用vscode编辑器，安装live serve插件
然后在vscode编辑器的右下角有 Go live 按钮，点击自动启动本地服务器

右键，使用Live Server打开；

1. 安装node.js；
2. 安装http-server
http-server详细介绍，包括参数等： https://www.npmjs.com/package/http-server
在命令行中安装到全局（-g表示安装到全局，之后所有文件夹路径下输入http-server都可以使用）：
操作： 运行cmd + 输入以下命令：npm install http-server -g （可能会出现权限问题，在npm前加上sudo）
3. 开启服务
进入目标文件夹（也就是需要启动服务的文件夹），shfit+右键 —— “在此处打开Powershell窗口”，输入如下命令：
hs -o （等同于 http-server -open）
本地服务器就启动起来了，默认端口为8080。
遇到问题：端口被占用，修改端口：hs -o -p 8888
完毕！！

1、安装全局anywhere，npm install anywhere -g
2、cmd中进入要启动本地服务器的静态文件夹，执行命令：anywhere；
3、anywhere的网址： https://www.npmjs.com/package/anywhere

‘肆’ web前端项目部署到服务器：

执行成功后会生成dist文件

4.1 进入到nginx配置目录：/usr/local/nginx/conf,对 nginx.conf 文件进行配置

使用include可以配置多个.conf文件，如一个项目一个配置文件。在同目录下创建demo文件夹，并创建demo.conf配置文件

下面使用是以ip地址的方式创建的的配置文件

访问地址：

其中dist名称时可以修改，保持与/usr/local/nginx/html下cp名称一致，否则会访问不到;并且/usr/local/nginx/html目录可存在同一ip下多个web项目。

域名与ip绑定

配置域名demo.conf
eg: 域名 - demo.cn

4.2阿里云配置域名前缀
阿里云->域名->域名列表—>域名 管理-> 域名解析->解析设置

如图：记录值 填写当前服务ip

学习过程中所记录，有问题或者有好的方式欢迎指点。不胜感激 🤗 🤗 🤗