在线时间:8:00-16:00
迪恩网络APP
随时随地掌握行业动态
扫描二维码
关注迪恩网络微信公众号
开发环境 windows 开发工具 visual studio code node 安装和 npmwindows 安装node 可以直接在 node官网 直接下载直接当作普通软件安装即可。 安装 visual studio codevs code 正常软件安装 没有需要注意的,直接下载安装 安装React参照文档React JavaScript Tutorial in VS Code 文档已经很详细 按照文档来一遍就基本上没问题。
至此新建的React项目已经可以正常运行了 所有文件都可以直接使用VS Code直接修改。 安装 Debugger for Chrome1.VS Code 提供 Debugger for Chrome 插件 可以支持使用chrome内核debug。 直接搜索 安装 之后重新加载一次VS Code 在此处设置启动配置,文档原文中所说的会创建一个新的 创建完两个节点 之后 找到 { // 使用 IntelliSense 了解相关属性。 // 悬停以查看现有属性的描述。 // 欲了解更多信息,请访问: https://go.microsoft.com/fwlink/?linkid=830387 "version": "0.2.0", "configurations": [ { "type": "chrome", "request": "attach", "name": "Attach to Chrome", "port": 9222, "webRoot": "${workspaceFolder}" }, { "type": "chrome", "request": "launch", "name": "chrome", "url": "http://localhost:3000", "webRoot": "${workspaceFolder}" }, { "type": "node", "request": "launch", "name": "node", "program": "${workspaceFolder}\\start" } ] } 启动项目 选择之前添加的 chrome 节点启动 ,此时会打开一个新的chrome页面 在项目源代码种找到 至此已经可以简单进行调试了。 安装 eslinteslint 是一个可组装的JavaScript和JSX检查工具。可用于检查语法错误规范代码。
3.打开VS Code 的 命令面板 直接在查看种找到或者 参考文档中还有配置分号的规则,需要的可以添加。 到此这篇关于visual studio code + react 开发环境搭建的文章就介绍到这了,更多相关vscode react环境搭建内容请搜索极客世界以前的文章或继续浏览下面的相关文章希望大家以后多多支持极客世界! |
请发表评论