【http-server】http-server的安装、前端使用http-server启动本地dist文件服务:

这篇具有很好参考价值的文章主要介绍了【http-server】http-server的安装、前端使用http-server启动本地dist文件服务:。希望对大家有所帮助。如果存在错误或未考虑完全的地方,请大家不吝赐教,您也可以点击"举报违法"按钮提交疑问。


一、http-server 简介:

http-server 是一个简单的零配置的命令行
http服务器,它足够强大便于生产和使用,用于本地测试和开发。

有时候我们打开一个文档使用file协议打开的时候,不能发送ajax请求,只能使用http协议才能请求资源,具体的区别大家可以去参考[这篇文档] (www.cnblogs.com/lishanlei/p…),所以此时我们需要在本地建立一个http服务,通过IP加端口号,来访问资源。
我一般的做法就是通过vscode的插件或者通过webstorm来打开,现在可以通过http-server来便捷的创建一个本地服务。

二、安装node.js:https://nodejs.org/en

官网地址 ,下载官网推荐版本,并安装。
在命令行输入命令node -v以及npm -v检查版本,确认是否安装成功。

三、安装http-server:https://www.npmjs.com/package/http-server

http-server的详细介绍,包括参数等: www.npmjs.com/package/htt…;
在命令行中安装到全局,最好是使用管理员权限安装 (-g表示安装到全局,之后所有文件夹路径下输入http-server都可以使用):

npm install http-server -g
四、开启服务:

命令行中进入目标文件夹(也就是需要启动服务的文件夹),输入如下命令:

http-server  #或者 简写  hs

本地服务器就启动起来了,默认端口为8080。

五、http-server参数:
【1】修改端口
http-server  -a 127.0.0.1 -p 8090
http-server [path] [options]

****是目录地址,可以省略,默认是cmd打开的路径地址
-a 参数是监听地址
-p 参数是监听端口

【2】其他参数
参数 作用
-p 或者 --port 端口设置,默认是 8080
-a 监听地址设置默认是 0.0.0.0
-d 是否显示文件列表 默认true
-i 显示自动索引 默认true
-g 或者 --gzip 默认false,当文件的gzip版本存在且请求接受gzip编码时,它将服务于./public/some-file.js.gz,而不是./public/some-file.js
-e 或者 --ext 如果没有提供默认文件扩展名(默认为html)
-s或者 --silent 禁止控制台日志信息输出
–cors 允许跨域资源共享
-o 启动服务后打开默认浏览器
-c 设置缓存cache-control max-age heade存留时间(以秒为单位),示例:-c10是10秒,默认是3600秒,如果要禁用缓存就使用-c-1
-U 或者 --utc 使用 UTC格式,在控制台输出时间信息
-P 或者 --proxy 通过一个 url地址,代理不能通过本地解析的资源
-S 或者 --ssl 使用https协议
-C 或者 --cert ssl证书文件的路径,默认是cert.pem
-K 或者 --key ssl密匙文件路径
-h 或者 --help 显示帮助
六、案例:

http-server --cors -o

【http-server】http-server的安装、前端使用http-server启动本地dist文件服务:,软件与插件,http,前端,http-server,node.js文章来源地址https://www.toymoban.com/news/detail-569748.html

到了这里,关于【http-server】http-server的安装、前端使用http-server启动本地dist文件服务:的文章就介绍完了。如果您还想了解更多内容,请在右上角搜索TOY模板网以前的文章或继续浏览下面的相关文章,希望大家以后多多支持TOY模板网!

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处: 如若内容造成侵权/违法违规/事实不符,请点击违法举报进行投诉反馈,一经查实,立即删除!

领支付宝红包 赞助服务器费用

相关文章

  • 65 # 实现 http-server 里的 gzip 压缩

    服务端优化都是:压缩 + 缓存 前端可以通过 webpack 插件进行压缩 gzip 根据替换来实现的,重复率越高,压缩后的结果越小 方式一:读取文件压缩,如果文件大的话都读取到内存中,耗内存 方式二:用转化流(可读可写)的方式,服务端的文件 = 压缩 = 客户端 新建 1.txt 文件

    2024年02月14日
    浏览(30)
  • 73 # 发布自己的 http-server 到 npm

    1、添加 .npmignore 文件,忽略不需要的文件 2、去官网https://www.npmjs.com/检查自己的包名是否被占用 3、切换到官方源,然后检查确认 4、登录 npm 账号 5、发布 6、查看发布情况,发布成功之后,等一会,我们就能看到自己的包在 npm 上了 7、更新版本,我们添加一个 README.md 文件

    2024年02月11日
    浏览(29)
  • 通过 http-server 运行刚打包出来的脚手架项目

    这里 我打包了自己的vue项目 react其实也一样 如果我直接 打开打包出来的 dist 下面的index.html 会出现白屏资源找不到 或者跨域等问题 这个问题其实配个nginx也能解决 但是其实如果只是想做个测试 nginx就太麻烦了 我们可以通过npm指令 全局安装一个http-server 终端执行 安装好依赖

    2024年02月09日
    浏览(29)
  • PLC通过智能网关实现HTTP-Server接口(带Postman测试截图)

             智能网关IGT-DSER集成了多种PLC的原厂协议,方便实现各种PLC的原厂协议转换为HTTP协议的服务端,通过网关的参数配置软件绑定JSON文件的字段与PLC寄存器地址,即可接收来自客户端的GET、PUT和POST命令,解析和打包JSON文件。        本案列是罗克韦尔(AB)的PLC,首

    2024年02月02日
    浏览(36)
  • 使用node搭建服务器,前端自己写接口,将vue或react打包后生成的dist目录在本地运行

    vue项目打包后生成的dist目录如果直接在本地打开index.html,在浏览器中会报错,无法运行起来。 通常我是放到后端搭建的服务上面去运行,当时前端自己也可以是node,nuxt搭建服务器,写接口等等 如果想在本地运行,我们可以借助node.js+express搭建一个服务器,将打包后的文件部

    2024年02月03日
    浏览(29)
  • vue打包后dist文件在本地启动运行

    vue项目开发好后,想在本地运行测试最后的打包文件可以通过http-server来启动。步骤如下: 命令截图 最后在浏览器输入:127.0.0.1:9007就可以查看了

    2024年02月12日
    浏览(39)
  • 前端本地原生开发好用的 http server 服务(npm 包形式、支持热更新、简单好用)

    有时候在本地原生网页开发的时候,需要起一个服务能够直接访问当现在正在开发 index.html 等内容,也就是希望通过 npm 包在进入项目文件夹后,直接可以起一个 可访问的 http 链接 ,不希望在去安装 nginx 。 下面例举几个: serve:为本地静态页面创建一个可访问的服务,不支

    2024年02月04日
    浏览(40)
  • 如何使用Node.js快速创建HTTP服务器并实现公网访问本地Server

    Node.js 是能够在服务器端运行 JavaScript 的开放源代码、跨平台运行环境。Node.js 由 OpenJS Foundation(原为 Node.js Foundation,已与 JS Foundation 合并)持有和维护,亦为 Linux 基金会的项目。Node.js 采用 Google 开发的 V8 运行代码,使用事件驱动、非阻塞和异步输入输出模型等技术来提高

    2024年01月15日
    浏览(44)
  • 在vscode中安装使用live Server(前端搭建自己的本地服务器环境)

    一、在扩展中搜索live Server,找到并下载,下载完后点击设置图标,点击扩展设置  二、点击在settings.json中编辑,在JSON中修改添加下列代码 端口号可配,注意不要与其他服务冲突; AdvanceCustomBrowserCmdLine填写自己实际chrome的路径;  三、保存重启vscode,点击右下角的go live 就可

    2024年02月16日
    浏览(45)
  • Mac Docker安装配置nginx,配置代理前端访问服务器后端访问本地启动项目

     或者直接通过docker客户端查看 --name NginxTest:容器名称 -p 8080:8080:映射端口 -d nginx:设置容器后台运行  docker客户端查看 1)全局块:配置服务器整体运行的配置指令 nginx 服务器整体运行的配置指令,主要包括配置运行 Nginx 服务器的用户(组)、允许生成的 worker process 数,

    2024年02月02日
    浏览(52)

觉得文章有用就打赏一下文章作者

支付宝扫一扫打赏

博客赞助

微信扫一扫打赏

请作者喝杯咖啡吧~博客赞助

支付宝扫一扫领取红包,优惠每天领

二维码1

领取红包

二维码2

领红包