概述

习惯了IDEA写代码,也不想在下一个webstorm,而且IDEA是webstorm的父集,webstorm能干的,IDEA应该也是可以的。本篇随便记录下idea下的react的环境搭建。

环境

windows 10

intellij IDEA 2017.3

node.js  9.9

安装

node.js安装基本是傻瓜操作,在这不详细描述。安装完后,windows已经默认有node环境配置。

因为npm的镜像是国外的,除非你能翻墙,否则一般是安装不了,能的话安装也会非常缓慢。但国内阿里开发的淘宝npm镜像,就能满足我们的需求。win + R 输出cmd打开黑窗口  npm install -g cnpm --registry=https://registry.npm.taobao.org 等待安装

出现这个就证明安装成功

intellij IDEA

直接去官网下载,如果是免费版的可能会出现无法安装的情况,所以建议下完整版的。激活的话,有条件购买正版,学生党之类自己想办法(你懂的)

进入IDEA后,ctrl + alt + s 如果没安装node.js是没有这个插件的,现在我们安装插件

在file > setting > plugins 然后手动点击Browe rep....

在搜索里找nodejs

安装完,重启IDEA就能找到上图的node.js and npm

还得在黑窗口运行  npm install -g create-react-app搭建react脚手架,然后新建一个react项目

然后等待。。。下载一些核心依赖包,出现下面文字就成功了

Inside that directory, you can run several commands:
npm start
Starts the development server.
npm run build
Bundles the app into static files for production.
npm test
Starts the test runner.
npm run eject
Removes this tool and copies build dependencies, configuration files
and scripts into the app directory. If you do this, you can’t go back!
We suggest that you begin by typing:
cd dragtest
npm start
Happy hacking! Done

接下去就是运行npm

成功跑起来啦。。

看浏览器,搭建成功

最后,初学react可看下《react入门实例》

======================================================

如发现错误,请及时留言,lz及时修改,避免误导后来者。感谢!!!

IDEA开发React环境配置的更多相关文章

  1. Selenium2学习-001-Selenium2 WebUI自动化Java开发 Windows 环境配置

    此文主要介绍 Selenium2 WebUI自动化Java开发 Windows 环境配置,供各位亲们参考,若有不足之处,敬请各位大神指正,非常感谢! 所需软件列表如下所示: 所属分类 具体名称 备注 ...

  2. IntelliJ IDEA开发golang环境配置

    IntelliJ IDEA开发golang环境配置 首先把GO安装好...(自行安装,附上一篇我之前写的MAC安装GO) 安装IntelliJ IDEA,下载地址: https://www.jetbr ...

  3. Android开发adb环境配置

    adb的全称为Android Debug Bridge,就是起到调试桥的作用. 在命令行cmd中打开adb,如果Android开发的环境配置有误,会出现如下错误提示: 解决方法,右键我的电脑-> ...

  4. PHP开发调试环境配置(基于wampserver+Eclipse for PHP Developers )

    1 软件准 WampServer 下载地址:http://www.wampserver.com/en/#download-wrapper    我下的是 里面包含了搭建PHP必须的4个软件:   1. ...

  5. Eclipse++Xdebug开发php环境配置

    一.php环境配置: 本次使用了appserv 2.5.10集成安装包.具体版本如下,安装后php版本是5.2.6 vc6,apache版本2.2 安装完成后,php配置文件在c:\windows目录 ...

  6. PHP开发调试环境配置

    ——基于wamp和Eclipse for PHP Developers 引言 为了搭建PHP开发调试环境,我曾经在网上查阅了无数的资料,但没有一种真正能够行的通的.因为PHP开发环境需要很多种软件相互 ...

  7. Android开发之环境配置篇

    Android环境配置: 一.JDK(不用安装) 1.拷贝 D:\Java\jdk1.8.0_91 文件内容 2. 安卓ADT ADT(Android Development Tools):安装ADT ...

  8. React环境配置(第一个React项目)

    使用Webpack构建React项目 1. 使用NPM配置React环境 NPM及React安装自行百度 首先创建一个文件夹,the_first_React 进入到创建好的目录,npm init,然后 ...

  9. Go程序开发---Go环境配置:CentOS6.5+Go1.8标准包安装

    1.Go安装 1.1Go的三种安装方式 Go有多种安装方式,可以选择自己习惯的方式进行,这里介绍三种安装方式: 1)Go源码安装 2)Go标准包安装 3)第三方工具安装 这里主要介绍下Go标准包在Ce ...

随机推荐

  1. Excel单元格锁定及解锁

    Excel VBA 宏 学习使用: 一.工作表单元格的锁定: 1.选择需要锁定的单元格. 2.鼠标右键----设置单元格格式. 3.设置  “保护”--锁定 -- 确定. 4.回到表头,[审阅]--- ...

  2. MySQL5.7 安装和配置环境变量

    安装 1.下载安装包 官网地址:https://dev.mysql.com/downloads/mysql/ 2.选择 Custom,自定义 3.根据自己系统选择 x64还是x86,然后点击第一个箭头 ...

  3. Linux shell awk中print及变量使用

    Linux处理文本工具     grep: 过滤文本内容     sed:  编辑文本内容     awk:   显示文本      awk:  Aho Peter Weinberger  Kerni ...

  4. 使用docker搭建redis-cluster环境

    目录 基础环境信息 搭建步骤 搭建中遇到的问题 其他参考     临时接到一个测试任务,而测试需要用到redis-cluster环境,却没有现成的环境可用,于是只能自力更生搭建测试环境.一开始想采用在 ...

  5. NetScaler的常用配置

    CITRIX NETSCALER常用功能有:LB,CS,GSLB,SSL LB实现的功能是服务器负载均衡,CS实现基于七层(域名,IP等)的负载均衡,GSLB实现的功能是全局负载均衡,SSL实现的功能 ...

  6. Go Programming Language

    [Go Programming Language] 1.go run %filename 可以直接编译并运行一个文件,期间不会产生临时文件.例如 main.go. go run main.go 2.P ...

  7. Peekaboo(2019年上海网络赛K题+圆上整点)

    目录 题目链接 题意 思路 代码 题目链接 传送门 题意 你的位置在\(O(0,0)\),\(A\)的位置为\((x_1,y_1)\),\(B\)的位置为\((x_2,y_2)\),现在已知\(a=O ...

  8. 10-赵志勇机器学习-meanshift

    (草稿) meanshift 也是一种聚类方法. 优点在于:不需要提前指定类型数. 缺点就是计算量大 过程:(最一般的做法,没有使用核函数) 1. 逐点迭代,设置为位置中心 2. 计算所有点到位置中心 ...

  9. 复制excel表中的数据

    <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8&quo ...

  10. contest4 CF1091 div2 ooooxx ooooxx ooooox

    题意 div2E 一个有\(n+1\)个点的无向图, 给出\(n\)个点的度数, 求出每一种可能的\(n+1\)的度数 (题面附带公式 graph realization problem)