使用inotifywait监控CSS文件修改事件；2. 通过shell脚本结合Chrome远程调试接口触发页面刷新；3. 或临时使用live-server实现自动重载，提升开发效率。
如果您在使用Linux Fedora进行Web开发时，希望实现CSS文件修改后自动触发HTML页面重载，可以通过inotify机制监控文件变化并执行刷新操作。以下是具体实现方式：
一、使用inotifywait监控文件变化
inotifywait是inotify-tools工具包中的命令行工具，能够监听指定目录或文件的变更事件，如修改、创建或删除。通过它可检测CSS文件是否被保存。
1、确保已安装inotify-tools：sudo dnf install inotify-tools
2、运行inotifywait命令监控CSS文件所在目录：inotifywait -m -e modify –format ‘%f’ /path/to/css/directory
立即学习“前端免费学习笔记（深入）”；
3、当检测到CSS文件被修改时，该命令会输出文件名，后续可结合脚本触发重载动作。
二、结合shell脚本触发浏览器刷新
通过shell脚本捕获inotifywait的输出，并调用外部工具向浏览器发送刷新指令。需借助支持远程调试的浏览器（如Chrome）和curl工具。
1、启动Chrome时启用远程调试端口：google-chrome –remote-debugging-port=9222
2、编写循环脚本持续监听文件变化并请求刷新：
while inotifywait -e modify /path/to/style.css; do curl -s “http://localhost:9222/json” | grep -o ‘”url”:”[^”]*”‘ | cut -d'”‘ -f4 | xargs -I {} curl -X POST {} -d ‘{“command”:”reload”}’; done
3、将上述脚本保存为auto-reload.sh并赋予执行权限：chmod +x auto-reload.sh
三、利用第三方Node.js轻量替代方案模拟热重载
虽然目标是在Fedora上原生实现，但可临时使用Node.js工具如live-server提供快速反馈循环，辅助开发流程。
1、全局安装live-server：npm install -g live-server
2、进入项目根目录并启动服务：live-server –port=8000
3、访问http://localhost:8000，任意更改CSS文件后，页面将自动重载。
以上就是Linux Fedora用inotify监控，CSS变HTML自动重载！的详细内容，更多请关注创想鸟其它相关文章！
版权声明：本文内容由互联网用户自发贡献，该文观点仅代表作者本人。本站仅提供信息存储空间服务，不拥有所有权，不承担相关法律责任。
如发现本站有涉嫌抄袭侵权/违法违规的内容， 请发送邮件至 chuangxiangniao@163.com 举报，一经查实，本站将立刻删除。
发布者：程序猿，转转请注明出处：https://www.chuangxiangniao.com/p/1599606.html
微信扫一扫 
支付宝扫一扫 
