1.安装node

  下载: https://nodejs.org/en/download/

  测试--->返回版本号即为安装成功:

    $ node -v

    $ npm -v

2.安装全局create-react-app

  $ sudo npm install -g create-react-app

3. 构建React开发环境create-react-app

  $ create-react-app my-app

4.安装babel---@babel/standalone

  1)进入my-app

    $ cd my-app

  2) npm 初始--->一路回车

    $ npm init

  3)安装bable/standalone

    $ npm install --save-dev @babel/standalone

5.运行

  $ cd my-app

  $ npm start

6.本地引用路径

<script src="/my-app/node_modules/@babel/standalone/babel.js"></script>

<script src="/my-app/node_modules/react/umd/react.development.js"></script>

<script src="/my-app/node_modules/react-dom/umd/react-dom.development.js"></script>

Mac下搭建react及bable的更多相关文章

  1. Mac下搭建react native开发环境

    安装必需软件 Homebrew Homebrew, Mac系统的包管理器,用于安装NodeJS和一些其他必需的工具软件. /usr/bin/ruby -e "$(curl -fsSL htt ...

  2. Mac下搭建react开发环境

    安装node 官网下载 https://nodejs.org/en/ 双击安装,接下来都是默认选择即可,直至安装成功 测试是否安装成功,分别输入以下命令: node -v npm -v 如下图所示,说 ...

  3. react-native —— 在Windows下搭建React Native Android开发环境

    在Windows下搭建React Native Android开发环境 前段时间在开发者头条收藏了 @天地之灵_邓鋆 分享的<在Windows下搭建React Native Android开发环 ...

  4. Mac下搭建hexo

    Mac下搭建hexo 并部署到gitcafe 1.安装brewhome ruby -e "$(curl -fsSL https://raw.github.com/Homebrew/homeb ...

  5. MAC下搭建及使用XAMPP的详细教程

    Windows和Linux都可以搭建本地伺服器(LAMP和IIS),Mac當然也可以,下面教你怎麼使用XAMPP在Mac下搭建一個功能齊全的本地伺服器 所需條件 1.Mac系統(廢話) 2.最好有可用 ...

  6. 1、在MAC上搭建React Native开发环境

    @import url(http://i.cnblogs.com/Load.ashx?type=style&file=SyntaxHighlighter.css);@import url(/c ...

  7. Mac下搭建php开发环境教程

    方案一:原生安装 这篇文章主要介绍了Mac下搭建php开发环境教程,Mac OS X 内置了Apache 和 PHP,这样使用起来非常方便.本文以Mac OS X 10.6.3为例,需要的朋友可以参考 ...

  8. 手把手教你在Windows下搭建React Native Android开发环境

    最近看到React Native好像好厉害的样子,好奇心驱使之下体验了一下并将在Window下搭建React Natvie Android环境的步骤记录下来,并有需要的朋友参考.(我都是参考官方文档的 ...

  9. mac 下搭建 Android 开发环境

    因工作需要,要在mac 下搭建 Android 开发环境.谷歌.度娘了好久,没有找个一个完整又系统的方法,很是苦恼.最终,皇天不负有心人,找到了下面这篇文档,结合亲身体验,特此记录.也为有这方面需求的 ...

随机推荐

  1. 测试Linux下tcp最大连接数限制

    现在做服务器开发不加上高并发根本没脸出门,所以为了以后吹水被别人怼“天天提高并发,你自己实现的最高并发是多少”的时候能义正言辞的怼回去,趁着元旦在家没事决定自己写个demo搞一搞. 这个测试主要是想搞 ...

  2. [Java学习]多线程

    关于多进程与多线程 使用多进程的目的:提高CPU利用率. 使用多线程的目的:提高应用程序?利用率. 多线程与多进程区别:进程间内存独立:同一个进程的线程间共享"堆内存和方法区内存" ...

  3. 663. Equal Tree Partition 能否把树均分为求和相等的两半

    [抄题]: Given a binary tree with n nodes, your task is to check if it's possible to partition the tree ...

  4. BigDecimal用法总结

    BigDecimal用法总结 BigDecimal常用于金额的计算,下面总结下这次项目中BigDecimal的用法. 1.加减乘除 2.设置精度 3.取反 加减乘除分别调用函数 [java] view ...

  5. django配合mongo使用

    环境 django 1.11.16 mongoengine 0.16.0 需要安装mongoengine库 pip install mongoengine 1.在配置文件中 # settings.py ...

  6. frp使用笔记

    参考文档: https://github.com/fatedier/frp/blob/master/README_zh.md#%E9%80%9A%E8%BF%87-frpc-%E6%89%80%E5% ...

  7. java多线程系列15 设计模式 生产者 - 消费者模式

    生产者-消费者 生产者消费者模式是一个非常经典的多线程模式,比如我们用到的Mq就是其中一种具体实现 在该模式中 通常会有2类线程,消费者线程和生产者线程 生产者提交用户请求 消费者负责处理生产者提交的 ...

  8. pycharm 2017最新激活码

    BIG3CLIK6F-eyJsaWNlbnNlSWQiOiJCSUczQ0xJSzZGIiwibGljZW5zZWVOYW1lIjoibGFuIHl1IiwiYXNzaWduZWVOYW1lIjoiI ...

  9. PHP幸运大转盘源码,支持ThinkPHP

    原理 先看图 可以看到1-6等奖都只有1个 ,7等奖有6个.指针默认指向上图位置,记为0°. 每个奖项对应不同的角度,圆的角度为360°,分成12块,所以每块为30°. 为了防止指针指着相邻两个将向之 ...

  10. 巧用 Jersey RESTful WebService框架解决文件上传乱码

    一.当我们使用jersey框架封装的restful进行文件上传时,会出现中文乱码,试用了过滤器设置编码都不管用.仔细想了很久解决办法,就用一个servelt来代替这个上传的restful接口实现上传的 ...