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 ...
随机推荐
- $Luogu2680/NOIp2015$ 运输计划
传送门 $Sol$ 最暴力的做法就是枚举最长链上的边,然后再算一次所有的链长,更新$ans$. 这里要求最大的最小,容易想到二分答案.对于二分的值$mid$,扫一遍所有的链,若链长小于等于$mid$, ...
- InterpreterPattern(解释器模式)-----Java/.Net
解释器模式(Interpreter Pattern)提供了评估语言的语法或表达式的方式,它属于行为型模式.这种模式实现了一个表达式接口,该接口解释一个特定的上下文.这种模式被用在 SQL 解析.符号处 ...
- Python第一天哇
iDLE的清除方法ctrl+: 当然,你首先要把网上百度到那个文件按照步骤加上去啦 我百度的=-=:https://www.cnblogs.com/stuqx/p/7291933.html Pyth ...
- 洛谷P3413 SAC#1 - 萌数 题解 数位DP
题目链接:https://www.luogu.com.cn/problem/P3413 题目大意: 定义萌数指:满足"存在长度至少为2的回文子串"的数. 求区间 \([L,R]\) ...
- 人脸识别系统 —— 基于python的人工智能识别核心
起因 自打用python+django写了一个点菜系统,就一直沉迷python编程.正好前几天公司boss要我研究一下人脸识别,于是我先用python编写了一个人脸识别系统的核心,用于之后的整个系统. ...
- vim添加多行注释的几种方式
最近需要在阿里云上部署项目,不可避免地会遇到vim这个工具,查了一些资料,总结了一下使用vim多行注释的方法 块操作 多行注释: 首先按esc进入命令行模式下,按下Ctrl + v,进入列(也叫区块) ...
- C++ string 常用函数
C++ String常用函数 一,类型别名 size_type 无符号整型 iterator 迭代器类型 const_iterator 只读迭代器 reverse_iterator 逆序迭代器 con ...
- java 常用锁
公平锁和非公平锁 1.公平锁,是指多个线程按照申请的顺序来获取锁,类似排队打饭,先来后到. 2.非公平锁,是指多个线程获取锁的顺序并不是按照申请锁的顺序,有可能后申请的线程 比先申请的线程优先获取锁, ...
- 洛谷p1137 模拟退火
题目链接:https://www.luogu.org/problem/P1337 以x为原点,将力分解成横纵方向的力,每次退火时单独对答案的横纵坐标进行判断是否更新答案 #include<ios ...
- 系统升级更新,cocoaPods不可用的问题
1.在终端运行: $ sudo gem install cocoa pods 会出现以下错误: ERROR: While executing gem ... (Errno::EPERM) Opera ...