grunt 搭建开发前台代理服务

三思原创大约 3 分钟

介绍了 Livereload 工具的常用属性和配置选项，包括端口号、主机名、排除文件列表、忽略文件类型、实时更新 CSS、图片、JavaScript 文件以及 H ML 文件等功能。同时提到了需要安装浏览器插件并启用的注意事项。

grunt 搭建本地开发前台代理服务

Livereload 是一个 Web 开发工具，可以在您编辑代码时自动重新加载网页，从而提高开发效率。以下是 Livereload 的一些常用属性和配置选项：

port：Livereload 服务器监听的端口号，默认为 35729。
host：Livereload 服务器监听的主机名，默认为 localhost。
excludeList：指定不需要监听变化的文件列表。默认情况下，Livereload 会监听 HTML、CSS、JavaScript、图片等文件类型的变化，但您可以通过 excludeList 属性来排除某些文件或目录，以避免不必要的重新加载。该属性的值是一个数组，可以包含文件名、文件夹名或通配符。例如：
```
app.use(livereload({
  excludeList: ['.git', 'node_modules']
}));
```
ignore：指定不需要监听变化的文件类型。该属性的值是一个正则表达式，可以排除某些文件类型。默认情况下，Livereload 会监听 HTML、CSS、JavaScript、图片等文件类型的变化，但您可以通过 ignore 属性来排除某些文件类型。例如：
applyCSSLive：指定是否启用 CSS 样式的实时更新。如果设置为 true，则在您修改 CSS 样式时，浏览器将自动更新样式，而无需手动刷新。默认为 true。
applyImgLive：指定是否启用图片的实时更新。如果设置为 true，则在您修改图片时，浏览器将自动更新图片，而无需手动刷新。默认为 true。
applyJsLive：指定是否启用 JavaScript 文件的实时更新。如果设置为 true，则在您修改 JavaScript 文件时，浏览器将自动重新加载 JavaScript 文件，而无需手动刷新。默认为 true。
applyHtmlLive：指定是否启用 HTML 文件的实时更新。如果设置为 true，则在您修改 HTML 文件时，浏览器将自动重新加载 HTML 文件，而无需手动刷新。默认为 true。
exts：指定要监听的文件扩展名。该属性的值是一个数组，可以包含文件扩展名。例如：
```
javascriptCopy code
app.use(livereload({
  exts: ['html', 'css', 'js']
}));
```

以上是一些常用的 Livereload 属性和配置选项，您可以根据实际需要进行设置。注意，在使用 Livereload 时，您需要在浏览器中安装 Livereload 插件，并在浏览器中启用它。

‍