当前位置: 首页 > article >正文

解决:Vue 中 debugger 不生效

目录

  • 1,问题
  • 2,解决
    • 2.1,修改 webpack 配置
    • 2.2,修改浏览器设置

1,问题

在 Vue 项目中,可以使用 debugger 在浏览器中开启调试。但有时却不生效。

2,解决

2.1,修改 webpack 配置

通过 Vue CLI 创建的项目,默认配置下是没有开启 source-map 的。

source-map 是一个信息文件,存储着位置信息:转换后代码的每一个位置,都对应着转换前的位置。这样就可以借助工具在报错时定位到原始代码。

转换的目的:提高性能和兼容性。比如对代码进行压缩混淆、多个文件合并(减少 HTTP 请求)、es6+ 转 es5 等等。

所以开启 source-map 即可。

// vue.config.js
module.exports = {
	configureWebpack: {
		devtool: "source-map",
	}
	// ...
}

那 Vite 项目呢?

2.2,修改浏览器设置

目前只发现 Chrome 浏览器支持。

1,打开控制台,点击这里打开设置

在这里插入图片描述

2,取消勾选即可

在这里插入图片描述


以上。


http://www.kler.cn/a/300647.html

相关文章:

  • 从零开始:Gitee 仓库创建与 Git 配置指南
  • JavaWeb简单开发
  • Flink (九):DataStream API (六) Process Function
  • 蓝桥杯 Python 组知识点容斥原理
  • 生成树机制实验
  • cmake foreach 条件判断
  • 如何识别和防范跨站脚本攻击(XSS)?
  • Pyspark下操作dataframe方法(2)
  • 【STM32】Cortex-M3的Systick定时器(实现Delay延时)
  • VBA学习(75):电子发票管理小助手/电子发票信息读取
  • ATF UFS初始化笔记
  • 【STM32】呼吸灯实现
  • 稀土阻燃剂:电子设备的安全守护者
  • AI Prompts Guide 【AI 提示语指南】
  • 使用 OpenCV 和 Matplotlib:绘制其彩色直方图以及拓展
  • Flink底层核心
  • LeetCode之栈
  • 从零开始学cv-0:图像处理基础知识
  • UDS 诊断 - InputOutputControlByIdentifier(按标识符的输入输出控制)(0x2F)服务
  • ARM base instruction -- bl
  • 【Hot100算法刷题集】双指针-02-盛水最多的容器(含暴力枚举、双指针法及其合理性证明)
  • 向量与矩阵几何关系
  • Nginx+Tomcat(负载均衡、动静分离)
  • 再遇“类和对象”
  • NC 和为K的连续子数组
  • 【PostgreSQL】扩展插件介绍