vscode 调试 react 项目
主要分为以下三个步骤
- 安装 debug for chrome
- 配置 launch.json 文件
配置内容如下
{
"version": "0.2.0",
"configurations": [{
"type": "chrome",
"request": "launch",
"name": "Launch Chrome",
"url": "http://localhost:3000", // 改为目标 url
"sourceMaps": true,
"webRoot": "${workspaceFolder}",
"skipFiles": [
"node_modules/**"
],
"sourceMapPathOverrides": {
"webpack:///*": "${webRoot}/*"
}
}]
}
3 使用 npm 启动项目, 关掉弹出的浏览器页面
4 打断点,在 Debug 模块启动调试
本配置参考 csdn 博客进行配置,详细链接在此 链接
vscode 调试 react 项目的更多相关文章
- VsCode调试vue项目
VsCode调试vue项目 VsCode如何调试vue项目,VsCode需要安装插件以及配置launch.json文件. 找到"扩展"或者按快捷键"Ctrl+Shift+ ...
- VSCode 安装 React 项目
1 下载nodejs 安装 (此时npm 和 node环境都已经装好) 2 安装淘宝镜像 npm install -g cnpm --registry=https://registry.npm.tao ...
- Vscode 调试 Flutter 项目
1.Vscode 中打开 flutter 项目进行开发 2.运行 Flutter 项目 flutter run r 键:点击后热加载,也就算是重新加载吧. p 键:显示网格,这个可以很好的掌握布局情况 ...
- 使用VSCode调试Egret项目中的ts代码
发布一次Android项目后,会在代码里,生成对应的.map文件.这样就可以在编辑器里或是Chrome里面对相应的TS文件进行断点调试了. 实际只要在tsconfig.json里面配置一下," ...
- 四、VSCode调试vue项目
1.先决条件设置 你必须安装好 Chrome 和 VS Code.同时请确保自己在 VS Code 中安装了 Debugger for Chrome 扩展的最新版本. 在可以从 VS Code 调试你 ...
- 解决vscode开发react项目没有html标签自动补全
怎么设置自动补全: 左下角齿轮按钮--设置-- 在搜索框中输入Include Languages,选择Emmet,并在Emmet:include language下点击在setting.json中编辑 ...
- react-create-app 构建react项目的流程以及需要注意的地方
Hello 小伙伴们,如果觉得本文还不错,记得给个 star , 小伙伴们的 star 是我持续更新的动力!GitHub 地址 React 系列文章代码地址 一 目录 不折腾的前端,和咸鱼有什么区别 ...
- electron教程(番外篇二): 使用TypeScript版本的electron, VSCode调试TypeScript, TS版本的ESLint
我的electron教程系列 electron教程(一): electron的安装和项目的创建 electron教程(番外篇一): 开发环境及插件, VSCode调试, ESLint + Google ...
- electron教程(番外篇一): 开发环境及插件, VSCode调试, ESLint + Google JavaScript Style Guide代码规范
我的electron教程系列 electron教程(一): electron的安装和项目的创建 electron教程(番外篇一): 开发环境及插件, VSCode调试, ESLint + Google ...
随机推荐
- Java 从入门到进阶之路(二十)
在之前的文章我们介绍了一下 Java 中的包装类,本章我们来看一下 Java 中的日期操作. 在我们日常编程中,日期使我们非常常用的一个操作,比如读写日期,输出日志等,那接下来我们就看一下 Java ...
- 【题解】BZOJ5093图的价值(二项式+NTT)
[题解]BZOJ5093图的价值(二项式+NTT) 今天才做这道题,是我太弱了 强烈吐槽c++这种垃圾语言tmd数组越界不re反倒去别的数组里搞事情我只想说QAQ 推了一张A4纸的式子 考虑每个点的度 ...
- 用Decorator实现依赖注入,像Java一样写后台
最近闲来无事,突发奇想,也顺便练练手,于是就萌生了,能否用typescript的decorator写一个Nodejs SpringMVC,通过依赖注入,自动实现文件加载,实例化等.然后就有了这个项目. ...
- Redis系列之----Redis的数据类型及使用场景
Redis是一个开源的.高性能的.基于键值对的缓存与存储系统,能够提供多种不同的键值数据类型来适应不同场景下的缓存和存储需求. Redis中所有的数据都存储在内存中,因此读写速度非常快,相 ...
- Java工作流引擎节点接收人设置“按自定义SQL计算”系列讲解
关键字: 驰骋工作流程快速开发平台 工作流程管理系统 工作流引擎 asp.net工作流引擎 java工作流引擎. 开发者表单 拖拽式表单 工作流系统CCBPM节点访问规则接收人规则 适配数据库: o ...
- 剑指Offer-3~9题
3. 数组中重复的数字 题目描述: 在一个长度为 \(n\) 的数组里的所有数字都在 \(0\) 到 \(n-1\) 的范围内. 数组中某些数字是重复的,但不知道有几个数字是重复的,也不知道每个 ...
- 高效测试框架推荐之Ginkgo
自2015年开始,七牛工效团队一直使用Go语言+Ginkgo的组合来编写自动化测试用例,积累了大约5000+的数量.在使用和维护过程中,我们觉得Ginkgo的很多设计理念和功能非常赞,因此特分享给大家 ...
- HTML 图片(image) 左右滑动
1.需求 需要用简单动画的形式将一组图片进行展示,图片数量不固定 2.效果如下: 3.思路 说到动画,首先想到使用-webkit-transition:;因为这个最简单好用,首先将图片都放在左侧,然后 ...
- Airbnb如何应用AARRR策略成为全球第一民宿平台
案例背景 基于房东和租客的痛点构建短租平台,但困于缓慢增长 2007年,住在美国旧金山的两位设计师——BrianChesky与Joe Gebbia正在为他们付不起房租而困扰.为了赚点外块,他们计划将阁 ...
- k8s内运行ubuntu容器
k8s内运行ubuntu镜像 环境 互相能访问的4台机器master,node01,node02,node03,4核心,内存8G 使用root操作 安装k8s 在master安装docker.kube ...