使用connect打开指定html方法

  由于localhost会直接链接到了index.html,所以我们可以通过base选项设置打开html,这是我的目录,我要打开根目录下的test.html

connect:{
options: {
port: 9000,
open: true,
livereload: 35729,
// Change this to '0.0.0.0' to access the server from outside
hostname: 'localhost',
useAvailablePort:true,
},
server: {
options: {
oprt:9001,
base:{
path:'./',
options:{
index:'./test.html'
}
}
},
keepalive:true
}
}

如果不设置,那么localhost会去寻找index.html,若没有找到就会返回根目录

如果没有设置useAvailablePort ,自行设置port有可能会出现Port is already being used 那么通过杀死使用该端口的进程来解决

connect Option 详细内容见https://www.jianshu.com/p/898cbc5724a0

port

类型: Integer(整数)
默认值:8000

网络服务器将响应的端口。如果指定的端口已经在使用中,则该任务将失败(除非设置了useAvailablePort)。您可以使用特殊值0'?'使用系统分配的端口。

protocol

类型:String
默认值:'http'

网络通信协议,可以是'http', 'http2''https'.

hostname

类型:String
默认值:0.0.0.0

可以访问网络服务器的主机名.
将其设置为'*',像“ 0.0.0.0”,将使服务器可以从任何本地局域网 的IPv4地址访问 '127.0.0.1',并将IP分配给以太网或无线接口如'192.168.0.x'或'10.0.0.x'。

如果open设置为true,该hostname设置将用于生成浏览器打开的URL,默认为localhost指定通配符主机名。

base

类型:String or Array or Object
默认值:.

  • String 提供文件的基本路径(或根目录),默认为 Gruntfile.js 所在的目录
  • Array 多个被映射到网站虚拟根目录的物理路径
  • Object 包含pathoptions参数,options 会传递给 serve-state 模块处理。
directory

类型:String
默认值:null

设置到希望能够浏览的目录 用于覆盖base选项的可浏览目录。

keepalive

类型:Boolean
默认值:false

让服务器持续运行。请注意,如果启用此选项,则此任务之后指定的任何任务将永远不会运行。默认情况下,一旦grunt的任务完成,Web服务器停止。此选项会更改该行为。

此选项也可以通过运行任务进行临时启用 grunt nnect:targetname:keepalive

debug

类型:Boolean
默认值:false

将debug选项设置为true以启用日志记录,而不是使用--debug标志。

livereload

类型:BooleanNumber
默认值:false

设置true或端口号,以使用connect-livereload将实时重新加载脚本的标记注入到页面中。

这不执行实时重新加载。它旨在与grunt-contrib-watch或另一个任务一起使用,在文件更改时将触发实时重新加载服务器。

open

类型: BooleanStringObject
默认值:false

在默认浏览器中打开提供的页面。

这可以是以下之一:

  • 指定true打开默认服务器URL(从protocol,hostname
    和port
    设置生成)

  • 指定URL会打开该URL

  • 使用以下键指定一个对象,直接配置为open:

useAvailablePort

类型:Boolean
默认值:false

如果true任务将在set port选项之后查找下一个可用端口。

												

Grunt connect的更多相关文章

  1. 前端开发 Grunt 之 Connect

    在前端开发过程中,我们需要在开发过程中,将开发中的站点部署到服务器上,然后,在浏览器中查看实际的效果,在 Grunt 环境下,可以直接使用集成在 Grunt 中的 Connect 插件完成站点服务器的 ...

  2. Grunt 之 Connect

    前端开发 Grunt 之 Connect 在前端开发过程中,我们需要在开发过程中,将开发中的站点部署到服务器上,然后,在浏览器中查看实际的效果,在 Grunt 环境下,可以直接使用集成在 Grunt ...

  3. 前端开发 Grunt 之 Connect详解

    在前端开发过程中,我们需要在开发过程中,将开发中的站点部署到服务器上,然后,在浏览器中查看实际的效果,在 Grunt 环境下,可以直接使用集成在 Grunt 中的 Connect 插件完成站点服务器的 ...

  4. 使用Grunt构建任务管理脚本(转)

    Grunt是构建Web开发的一个系统,但它创建比较困难.在这个指南中,你将学会如何配置Grunt创建一个现代的Web项目.当你完成教程中的配置之后,你的Gruntfile将具有: 从源目录中向目标目录 ...

  5. 利用简洁的图片预加载组件提升h5移动页面的用户体验

    在做h5移动页面,相信大家一定碰到过页面已经打开,但是里面的图片还未加载出来的情况,这种问题虽然不影响页面的功能,但是不利于用户体验.抛开网速的原因,解决这个问题有多方面的思路:最基本的,要从http ...

  6. 前端工作面试问题--摘取自github

    前端工作面试问题 本文包含了一些用于考查候选者的前端面试问题.不建议对单个候选者问及每个问题 (那需要好几个小时).只要从列表里挑选一些,就能帮助你考查候选者是否具备所需要的技能. 备注: 这些问题中 ...

  7. 了解Browserify

    Browserify是一个Javascript的库,可以用来把多个Module打包到一个文件中,并且能很好地应对Modules之间的依赖关系.而Module是封装了属性和功能的单元,是一个Javasc ...

  8. grunt之connect、watch

    先说下这两个插件配合的用处,简单的说,它们可以拯救你的F5.connect用于建立一个静态服务器,watch监听文件的修改并自动实时刷新浏览器的页面. 还是options走起. connect(V0. ...

  9. Sass和compass 安装 和配合grunt实时显示 [Sass和compass学习笔记]

    demo 下载http://vdisk.weibo.com/s/DOlfkrAWjkF/1401192855 为什么要学习Sass和compass ?提高站独立和代码产品化的绝密武器,尤其是程序化cs ...

随机推荐

  1. 深入浅出mybatis之映射器

    目录 概述 XML映射器 定义xml映射器 配置xml映射器 使用xml映射器 接口映射器 定义接口映射器 配置接口映射器 使用接口映射器 总结与对比 概述 映射器是MyBatis中最核心的组件之一, ...

  2. [Luogu P1516]青蛙的约会

    按照题意,显然可以列出同余方程,k即为所求天数,再将其化为不定方程 ,那么对这个方程用扩展欧几里德算法即可得出k,q的一组解,但是方程有解的充要条件是(m – n) 和L不同时为零并且x – y是m ...

  3. 移动端click事件300ms延迟

    移动端click 事件延迟300ms 一般情况下,如果没有经过特殊处理,移动端浏览器在派发点击事件的时候,通常会出现300ms左右的延迟.也就是说,当我们点击页面的时候移动端浏览器并不是立即作出反应, ...

  4. Python3:字符串的大小写和镜像字符串(swapcase()函数,chr(),ord(),translate()函数)

    题目: 请编程实现字符串的转换:1. 将"adsdsfdndsdsdfsfdsdASDSDEDSFE18754"字符串大写变小写,小写变大写:2. 并且将字符串变为镜像字符串,例如 ...

  5. print_r print var_dump echo区别

    print_r print_r(mixed $expression [,bool $true]) 显示关于一个变量的易于理解的信息,如果给出的是string/integer/float 将打印变量值本 ...

  6. JMeter学习笔记02-基础介绍

    基本构成 1)负载发生器:产生负载,多线程模拟用户行为 2)用户运行期:脚本运行引擎,用户运行器附加在线程上,根据指定脚本模拟指定的用户行为 3)资源发生器:生成测试过程中服务器.负载机的资源数据 4 ...

  7. centos7.5环境下编译安装php7.0.30并安装redis和mongo扩展

    .安装php7..30的脚本 # vim install_php.sh #!/bin/bash # 安装基本依赖 yum install -y gcc gcc-c++ htop telnet ioto ...

  8. 【原创】大叔经验分享(7)创建hive表时格式如何选择

    常用格式 textfile 需要定义分隔符,占用空间大,读写效率最低,非常容易发生冲突(分隔符)的一种格式,基本上只有需要导入数据的时候才会使用,比如导入csv文件: ROW FORMAT DELIM ...

  9. 在 VsCode 中自定义代码补全

    前言 之前公司的 Vscode 折腾成功过,如今给自己家装一个忘记怎么定义了,故回忆一下写个博文记录 代码补全顾名思义就是输入一两个字母自动提示相关的联想操作,由于VsCode非常精简所以很多联想没有 ...

  10. WPF学习:3.Border & Brush

    上一章<WPF学习:2.Layout-Panels-Countainers>主要介绍了布局,容器和面板.这一章主要开始介绍Border(边界)和Brush(画刷). 代码地址:http:/ ...