webstorm的Live Edit插件配合chrome扩展程序JetBrains IDE Support实现实时预览html效果
前言
我们平时在前端网页修改好代码要点击刷新再去看修改的效果，这样比较麻烦，那么很多软件都提供了实时预览的功能，我们一边编辑代码一边可以看到效果。下面说的是webstorm。
1 Live Edit
首先我们需要在webstorm的settings里安装插件Live Edit（一般会已经下载好）。
然后在settings里如下图所示路径找到插件进行设置。
2 JetBrains IDE Support 插件下载
阿里云盘地址
链接：https://www.alipan.com/s/ksu6C2k35z9
提取码：9ed6
将文件直接拖入下图的chrome扩展程序页面即可完成安装。
确认添加
ip地址和端口号自动生成，一般无需去改。下面就可以使用webstorm实现实时预览html效果了。
实时预览变更的页面
相关文章：
webstorm的Live Edit插件配合chrome扩展程序JetBrains IDE Support实现实时预览html效果
前言 我们平时在前端网页修改好代码要点击刷新再去看修改的效果，这样比较麻烦，那么很多软件都提供了实时预览的功能，我们一边编辑代码一边可以看到效果。下面说的是webstorm。 1 Live Edit 首先我们需要在webstorm的settings里安装插件Live …...
ROS环境搭建
ROS首次搭建环境 注：以下内容都是在已经安装好ros的情况下如何搭建workplace 一、创建工作空间二、创建ROS包三、注意 注：以下内容都是在已经安装好ros的情况下如何搭建workplace 如果没有安装好，建议鱼香ros一步到位:鱼香ROS 我也是装了好久…...
Cherry Studio + 火山引擎 构建个人AI智能知识库
🍉在信息化时代，个人知识库的构建对于提高工作效率、知识管理和信息提取尤为重要。尤其是当这些知识库能结合人工智能来智能化地整理、分类和管理数据时，效果更为显著。我最近尝试通过 Cherry Studio 和 火山引擎 来搭建个人智能知识库&#…...
Spring Boot 与 MyBatis 版本兼容性
初接触Spring Boot，本次使用Spring Boot版本为3.4.3，mybatis的起步依赖版本为3.0.0，在启动时报错，报错代码如下 org.springframework.beans.factory.BeanDefinitionStoreException: Invalid bean definition with name userMapper…...
《 C++ 点滴漫谈： 二十九 》风格 vs. C++ 风格：类型转换的对决与取舍
摘要 类型转换是 C 编程中的重要机制，用于在不同数据类型之间进行安全高效的转换。本博客系统介绍了 C 提供的四种类型转换运算符（static_cast、dynamic_cast、const_cast 和 reinterpret_cast）的用法及适用场景，分析了它们相较于…...
AI预测福彩3D新模型百十个定位预测+胆码预测+杀和尾+杀和值2025年3月3日第11弹
前面由于工作原因停更了很长时间，停更期间很多彩友一直私信我何时恢复发布每日预测，目前手头上的项目已经基本收尾，接下来恢复发布。当然，也有很多朋友一直咨询3D超级助手开发的进度，在这里统一回复下。 由于本人既精…...
ArcGIS Pro高级应用：高效生成TIN地形模型
一、引言 在地理信息科学与遥感技术的快速发展背景下，数字高程模型（DEM）已成为地形表达与分析的关键工具。 三角网（TIN）作为DEM的一种重要形式，因其能够精准描绘复杂地形特征而广受青睐。 ArcGIS Pro为用…...
【学术会议论文投稿】Spring Boot实战：零基础打造你的Web应用新纪元
第七届人文教育与社会科学国际学术会议（ICHESS 2024）_艾思科蓝_学术一站式服务平台 更多学术会议请看：https://ais.cn/u/nuyAF3 目录 一、Spring Boot简介 1.1 Spring Boot的诞生背景 1.2 Spring Boot的核心特性 二、搭建开发环境 2.1…...
OpenWebUI提示器：Prompt工程的“智能助手”还是“自动化革命”？
引言：当AI对话成为日常，如何让模型更懂你？ 在AI技术爆炸式发展的今天，从写邮件到生成代码，大型语言模型（如ChatGPT、Claude等）已深入日常场景。但你是否遇到过这样的问题？ “为什么…...
Spring Boot 异步编程深入剖析
Spring Boot 异步编程深入剖析 1. 异步方法的使用 原理深度解析 Spring Boot 的异步方法基于 Spring 的 AOP（面向切面编程）实现。当在方法上添加 Async 注解时，Spring 会为该方法所在的类创建一个代理对象。当调用该异步方法时，…...
使用pyinstaller和tinyaes，对加密文件文件源码进行打包
使用pyinstaller和tinyaes，对加密文件文件源码进行打包 winr后，进入cmd命令行 1. 安装虚拟环境 pip install virtualenv pip install virtualenvwrapper-win2. 制作虚拟环境 mkvirtualenv -p"你的Python解释器地址" py版本号 例如ÿ…...
分布式和微服务的理解
分布式系统 概念：分布式系统是由多个通过网络连接的节点组成的系统，这些节点分布在不同的地理位置或计算机上，它们相互协作，共同完成一个或多个任务，对用户或外部系统而言，就好像是一个单一的、统一的系统…...
麒麟V10-SP2-x86_64架构系统下通过KVM创建虚拟机及配置虚机的NAT、Bridge两种网络模式全过程
文章目录 一、什么是虚拟化？虚拟化具有哪些优势 二、常见的虚拟化技术1、kvm介绍2、kvm工作原理3、kvm功能 三、安装kvm并启动第一个kvm机器1、环境准备2、安装kvm工具3、启动并设置开机自启 libvirtd 服务4、验证 KVM 模块是否加载5、上传系统镜像到指定目录6、网络…...
watchEffect的用法
watchEffect的用法 watchEffect的回调方法里，用到了哪个属性，就监视哪个属性 let temp 0; let height 0; watchEffect(()>{if(temp.value > 60 || height.value > 80){console.log(给服务器发请求)} })...
第15届 蓝桥杯 C++编程青少组中级省赛 202408 真题答案及解析
第 1 题 【 单选题 】 定义 char a[]="hello\nworld"，执行 cout<<a，输出结果是（ ） A：helloworld B： hello world C：hellonworld D：hello\nworld 解析： 转义字符的作用 \n 是换行符，会被编译器解析为换行操作，而非直接输出字符 \n。 输出…...
扫描纸质文件转pdf---少页数+手机+电脑协作
针对手机上扫描软件扫描文件转pdf要收费的问题，提供一种在页数较少时的免费替代方案 。 实现方法：手机软件的免费功能将文件扫描并保存为图片电脑端在word中将图片拼成文档word转pdf 1.借助于“扫描全能王”APP可以免费扫描文件为图片的功能࿰…...
大模型巅峰对决：DeepSeek vs GPT-4/Claude/PaLM-2 全面对比与核心差异揭秘
文章目录 一、架构设计深度解剖1.1 核心架构对比图谱1.2 动态MoE架构实现架构差异分析表 二、训练策略全面对比2.1 训练数据工程对比2.2 分布式训练代码对比DeepSeek混合并行实现GPT-4 Megatron实现对比 2.3 关键训练参数对比 三、性能表现多维评测3.1 基准测试全景对比3.2 推理…...
运维实战---多种方式在Linux中部署并初始化MySQL
运维实战—多种方式在Linux中部署并初始化MySQL 前言实验环境介绍一、源码包安装MySQL 1、配置MySQL&编译安装2、初始化数据库3、配置环境变量 二、yum安装MySQL三、rpm安装MySQL 前言 MySQL是常用的关系型数据库，具有以下特点： 1、开源ÿ…...
SQL注入攻击
SQL注入攻击的原理 原理：将SQL命令插入到web表单递交或输入域名或页面请求的查询字符串，最终达到欺骗服务器，执行恶意的SQL命令 SQL注入攻击的主要原因 SQL注入主要原因是程序员在开发用户和数据库的系统时没有对用户输入的字符串进行过滤…...
面试常问的压力测试问题
性能测试作为软件开发中的关键环节，确保系统在高负载下仍能高效运行。压力测试作为性能测试的重要类型，旨在通过施加超出正常负载的压力，观察系统在极端条件下的表现。面试中，相关问题常被问及，包括定义、重要性、与负…...
Python爬虫实战：研究MechanicalSoup库相关技术
一、MechanicalSoup 库概述 1.1 库简介 MechanicalSoup 是一个 Python 库，专为自动化交互网站而设计。它结合了 requests 的 HTTP 请求能力和 BeautifulSoup 的 HTML 解析能力，提供了直观的 API，让我们可以像人类用户一样浏览网页、填写表单和提交请求。 1.2 主要功能特点…...
FastAPI 教程：从入门到实践
FastAPI 是一个现代、快速（高性能）的 Web 框架，用于构建 API，支持 Python 3.6。它基于标准 Python 类型提示，易于学习且功能强大。以下是一个完整的 FastAPI 入门教程，涵盖从环境搭建到创建并运行一个简单的…...
Java-41 深入浅出 Spring - 声明式事务的支持 事务配置 XML模式 XML+注解模式
点一下关注吧！！！非常感谢！！持续更新！！！ 🚀 AI篇持续更新中！（长期更新） 目前2025年06月05日更新到： AI炼丹日志-28 - Aud…...
Rust 异步编程
Rust 异步编程 引言 Rust 是一种系统编程语言，以其高性能、安全性以及零成本抽象而著称。在多核处理器成为主流的今天，异步编程成为了一种提高应用性能、优化资源利用的有效手段。本文将深入探讨 Rust 异步编程的核心概念、常用库以及最佳实践。 异步编程基础 什么是异步…...
EtherNet/IP转DeviceNet协议网关详解
一，设备主要功能 疆鸿智能JH-DVN-EIP本产品是自主研发的一款EtherNet/IP从站功能的通讯网关。该产品主要功能是连接DeviceNet总线和EtherNet/IP网络，本网关连接到EtherNet/IP总线中做为从站使用，连接到DeviceNet总线中做为从站使用。 在自动…...
HTML前端开发：JavaScript 常用事件详解
作为前端开发的核心，JavaScript 事件是用户与网页交互的基础。以下是常见事件的详细说明和用法示例： 1. onclick - 点击事件 当元素被单击时触发（左键点击） button.onclick function() {alert("按钮被点击了！&…...
力扣-35.搜索插入位置
题目描述 给定一个排序数组和一个目标值，在数组中找到目标值，并返回其索引。如果目标值不存在于数组中，返回它将会被按顺序插入的位置。 请必须使用时间复杂度为 O(log n) 的算法。 class Solution {public int searchInsert(int[] nums, …...
如何应对敏捷转型中的团队阻力
应对敏捷转型中的团队阻力需要明确沟通敏捷转型目的、提升团队参与感、提供充分的培训与支持、逐步推进敏捷实践、建立清晰的奖励和反馈机制。其中，明确沟通敏捷转型目的尤为关键，团队成员只有清晰理解转型背后的原因和利益，才能降低对变化的…...
【Linux】Linux安装并配置RabbitMQ
目录 1. 安装 Erlang 2. 安装 RabbitMQ 2.1.添加 RabbitMQ 仓库 2.2.安装 RabbitMQ 3.配置 3.1.启动和管理服务 4. 访问管理界面 5.安装问题 6.修改密码 7.修改端口 7.1.找到文件 7.2.修改文件 1. 安装 Erlang 由于 RabbitMQ 是用 Erlang 编写的，需要先安…...
在鸿蒙HarmonyOS 5中使用DevEco Studio实现指南针功能
指南针功能是许多位置服务应用的基础功能之一。下面我将详细介绍如何在HarmonyOS 5中使用DevEco Studio实现指南针功能。 1. 开发环境准备 确保已安装DevEco Studio 3.1或更高版本确保项目使用的是HarmonyOS 5.0 SDK在项目的module.json5中配置必要的权限 2. 权限配置 在mo…...