本地搭建http-server

820 阅读2分钟

这是我参与8月更文挑战的第18天,活动详情查看:8月更文挑战

1, 目的

本地打开一个HTML页面,一般都是file协议,当代码汇总存在httphttps的链接时候,页面就无法正常显示了,而且现在前端开发基本上都是单页应用,开启一个本地服务是很有必要的。

2,项目中安装配置

npm install http-server --save

开发中因为要多次使用,在package.json中添加配置, 新增一条命令

"scripts": {
    "http": "http-server -c-1 -p 9524",
  },

3, 参数说明

-c-1    #表示禁用缓存
-p 9527    # 表示指点端口号
-o /other/index.html   # 自动打开浏览器

4, 代理

http-server --proxy http://zlm.store.com.cn

5, 启动项目

npm run http

注意: 默认路径: ./public

6,HTTP详细介绍

1,http-server是一个简单的零配置命令行http服务器。它足够强大,足以用于生产用途,但它既简单又易于破解,可用于测试,本地开发和学习。

http-server 基于node运行,需要安装nodeJs环境,可以自行百度
node自带的npm包管理器
通过npm安装http-server

参数详解

-a 要使用的地址(默认为0.0.0.0)

-p 要使用的端口(默认为8080)

-d 显示目录列表(默认为“True”)

-i 显示autoIndex(默认为“True”)

-g或–gzip启用时(默认为“False”),它将用于./public/some-file.js.gz代替./public/some-file.jsgzip压缩版本的文件,并且该请求接受gzip编码。

-e或–ext默认文件扩展名(如果没有提供)(默认为’html’)

-s或–silent从输出中抑制日志消息

–cors通过Access-Control-Allow-Origin标题启用CORS

-o 启动服务器后打开浏览器窗口

-c设置缓存控制max-age头的缓存时间(以秒为单位),例如-c10 10秒(默认为’3600’)。要禁用缓存,请使用-
c-1。

-U或–utc在日志消息中使用UTC时间格式。

-P或–proxy代理无法在本地解决给定网址的所有请求

-S或–ssl启用https。

-C或–certssl证书文件的路径

-K或–keyssl密钥文件的路径

-r或者–robots提供一个/robots.txt

-h或–help打印此列表并退出。

7,MAC安装NGINX

(1)查看Nginx安装目录

-   nginx -V
-   nginx -v (查看版本信息)

(2)检查电脑是否安装了nginx


-   brew search nginx

(3) 检查nginx安装信息

-   brew info nginx

(4) 安装nginx

-   brew install nginx

(5) 安装目录


-   配置文件路径:/usr/local/etc/nginx/nginx.conf
-   安装路径:/usr/local/Cellar/nginx/1.15.7
-   服务器默认路径:/usr/local/var/www

(6) 查看nginx是否启动

-   ps -ef|grep nginx

(7) 启动nginx

-   nginx
-   ./nginx -s reload

8, MAC连接SSH

(1)mac 上传方式:

1, 方案一:

-   ssh root@30.23.4.37
-   paic12345
-   scp /Users/zhengliming511/Desktop/mf.png root@30.23.4.37:/root/btp_app/frontend/

2,方案二:


-   sftp root@30.23.4.37
-   put /Users/zhengliming511/Desktop/dist.zip /root/btp_app/frontend/