npm安装React Devtools调试工具(摘抄)

1、去git上下载react-devtools文件到本地,下载地址: https://github.com/facebook/react-devtools ;
     可以直接下载zip安装包解压,或者通过git clone来将项目拷贝到本地
    git clone https://github.com/facebook/react-devtools.git

2、进入react-devtools文件夹,用npm安装依赖,这里推荐临时使用淘宝镜像,快速一点。
     npm --registry https://registry.npm.taobao.org install

3、安装依赖成功后,我们便可以打包一份扩展程序出来。运行
     npm run build:extension:chrome
     这里成功后会显示并且会在你的项目目录中生成一个新的文件夹,react-devtools -> shells -> chrome -> build -> unpacked文件夹

 

4、打开chrome扩展程序chrome://extensions/

加载已解压的扩展程序(如果没有这个选项,请打开右上角的“开发者模式”),

选择第3步中的生成的unpacked文件夹。这时就会添加一个新的扩展程序react-devtools,并在你的浏览器右上角会有个react标志, 就表示成功啦。

原文地址:https://www.cnblogs.com/sunqq/p/10749069.html

时间: 2024-10-11 23:20:29

npm安装React Devtools调试工具(摘抄)的相关文章

npm搭建React项目

转自:http://blog.csdn.net/u012859720/article/details/70597119 要想使用npm,首先安装Node.js 一.安装全局包 $ npm install babel -g $ npm install webpack -g $ npm install webpack-dev-server -g 二.创建根目录 创建一个根目录,目录名为:myApp,再使用npm init初始化,生成package.json文件: $ mkdir myApp $ cd

Windows版本搭建安装React Native环境配置

1 安装Chocolatey 打开cmd黑窗口 @powershell -NoProfile -ExecutionPolicy Bypass -Command "iex ((new-object net.webclient).DownloadString('https://chocolatey.org/install.ps1'))" && SET PATH=%PATH%;%ALLUSERSPROFILE%\chocolatey\bin把这个代码粘进去,回车 2 安装No

史上最详细Windows版本搭建安装React Native环境配置 转载,比官网的靠谱亲测可用

史上最详细Windows版本搭建安装React Native环境配置 2016/01/29 |  React Native技术文章 |  Sky丶清|  95条评论 |  33530 views 编辑推荐:稀土掘金 是一个高质量的技术社区,从 React Native 到 RxJava,性能优化到优秀开源库,让你不错过移动开发的每一个技术干货.各大应用市场搜索「掘金」,技术干货尽在掌握中. 说在前面的话: 感谢同事金晓冰倾情奉献本环境搭建教程 之前我们已经讲解了React Native的OS X

利用npm安装/删除/发布/更新/撤销发布包 --社会我npm哥,好用话不多

一.什么是npm? npm是javascript的包管理工具,是前端模块化下的一个标志性产物 简单地地说,就是通过npm下载模块,复用已有的代码,提高工作效率 1.从社区的角度:把针对某一特定问题的模块发布到npm的服务器上,供社区里的其他人下载和使用,同时自己也可以在社区里寻找特定的模块的资源,解决问题 2.从团队的角度:有了npm这个包管理工具,复用团队既有的代码也变的更加地方便 二.利用npm安装包 npm安装的方式--本地安装和全局安装 什么时候用本地/全局安装? 1.当你试图安装命令行

通过npm使用React

要想使用npm,请先安装nodejs. 第一步.安装全局包$ npm install babel -g$ npm install webpack -g$ npm install webpack-dev-server -g第二步.创建根目录创建一个根目录,目录名为:reactApp,再使用 npm init 初始化,生成 package.json 文件: $ mkdir reactApp$ cd reactApp/$ npm initname: (reactApp) runoob-react-te

如何使用npm安装webpack

逛逛ReactJS, Angular2,vuejs的社区,大牛博客,知乎的时候看到的最多的可能就会有webpack,WebPack这个构建工具已经在社区中得到了广泛的认可,而Webpack已经成了React.js开发的标配,所以,我们有必要学习一下Webpack. 所以我在网上看了大量前辈的blog,闲暇之余总结了一些使用的方法,由于技术有限可能会有些不足希望多多指教. 首先webpack是什么,使用webpack是为了解决什么样的编程问题,官网上有这个问题的图例   https://webpa

[从零开始react001] 使用npm配置react webpack环境

1.react 简介 React 是一个Facebook出品的前端UI开发框架  在学习React官方的tutorials 中它为了让人容易开始,并没有给出详细配置react的步骤,在学习的过程过程中要不断的自己重新reload 页面来看效果. 本笔记记录了使用webpack来实现自动构建的详细过程.磨刀不误砍柴功,一劳永逸哦~ 保存刚写的代码,就会马上在页面上reload,非常省时的关键步骤! 2. 创建一个新目录并用npm初始化它 mkdir react-playground cd reac

windows 下 node 安装 react

当前node.npm都已安装了. 可是在执行 安装 react的时候总是报错 最后会生成一个报错的txt文件(  <[email protected]>npm-debug.log),如下图. 无语中...!!! 安装完最新的node之后,再安装react就没有问题了.(相关的文章) 准备工作做好之后,就可以跟着这个视频部署环境了.

React DevTools

[React DevTools] 在应用商店搜索安装.F12可打开.如果是react应用,在最右排会显示react标签. 参考:https://github.com/facebook/react-devtools