Developing React with Poi is as easy as adding the babel-preset-react-appto a .babelrc and installing React. This lesson will walk you through that quick process and get your React app up-and-running.

Install:

npm i react react-dom babel-preset-react-app babel-plugin-react-require

.babelrc:

{
"presets": [
"react-app"
],
"plugins": [
"react-require"
]
}

index.js:

// import React from 'react'; // NO NEED because babel-plugin-react-require

import {render} from 'react-dom';

render(<h1>React</h1>, document.getElementById("app"))

Run:

poi

[Poi] Customize Babel to Build a React App with Poi的更多相关文章

  1. [Poi] Build a Vue App with Poi

    Poi uses the Vue babel presets by default, so there is no additional install required to get up-and- ...

  2. 使用create react app教程

    This project was bootstrapped with Create React App. Below you will find some information on how to ...

  3. 深入 Create React App 核心概念

    本文差点难产而死.因为总结的过程中,多次怀疑本文是对官方文档的直接翻译和简单诺列:同时官方文档很全面,全范围的介绍无疑加深了写作的心智负担.但在最终的梳理中,发现走出了一条与众不同的路,于是坚持分享出 ...

  4. 在 .NET Core 5 中集成 Create React app

    翻译自 Camilo Reyes 2021年2月22日的文章 <Integrate Create React app with .NET Core 5> [1] Camilo Reyes ...

  5. Create React App

    Facebook开源了React前端框架(MIT Licence),也同时提供了React脚手架 - create-react-app. create-react-app遵循约定优于配置(Coc)的原 ...

  6. [Parcel] Bundle a React App with Parcel

    Parcel comes in as the new cool kid in the bundlers world. Unlike other bundlers which take lots of ...

  7. [PReact] Reduce the Size of a React App in Two Lines with preact-compat

    Not every app is greenfield, and it would be a shame if existing React apps could not benefit from t ...

  8. 如何扩展 Create React App 的 Webpack 配置

    如何扩展 Create React App 的 Webpack 配置  原文地址https://zhaozhiming.github.io/blog/2018/01/08/create-react-a ...

  9. react系列笔记1 用npx npm命令创建react app

    react系列笔记1 用npx npm命令创建react app create-react-app my-app是开始构建新的 React 单页应用程序的最佳方式.它已经为你设置好了开发环境,以便您可 ...

随机推荐

  1. linux上测试磁盘IO速度

    运维工作,经常要测试服务器硬件性能,以此来判断是否存在性能瓶颈. 下面介绍在linux上测试磁盘IO速度的工具: 1.hdparm CentOS中,安装的两种方法: 1) yum安装. # yum i ...

  2. the prblem 3n+1

    题目描述计算机科学中的问题通常被归类为属于某一类问题(例如,NP,不可解,递归).在这个问题中,您将分析算法的属性,该算法的分类对于所有可能的输入都是未知的. 考虑下面的算法: 1.输入n 2.输出n ...

  3. mysql 查询格式化时间

    select DATE_FORMAT(addtime,'$m %d %Y') from tablename 输出:01 28 2019 数据库时间格式:2019-01-28 15:01:20

  4. 转义JavaScript特殊字符

    JavaScriptUtils.javaScriptEscape("%admin' or '1=1") //转义JavaScript特殊字符

  5. web移动端-弹性盒模型

    (父元素加) : /*新版弹性盒模型*/ /* display: flex; */ /*设置主轴方向为水平方向*/ /* flex-direction: row; */ /*设置主轴方向为垂直方向*/ ...

  6. 永远不要在MySQL中使用“utf8”

    最近我遇到了一个 bug,我试着通过 Rails 在以“utf8”编码的 MariaDB 中保存一个 UTF-8 字符串,然后出现了一个离奇的错误: Incorrect string value: ‘ ...

  7. [原创]关于javax.servlet.ServletException: File [&#47;loginController&#47;getVerifCode.jsp] not found异常 解决方案

    如果前台可以访问 后台并且有数据进行响应,那么一下方案也许可以帮到你... 修改前: 出现异常 javax.servlet.ServletException: File [/loginControll ...

  8. 一张图说docker

  9. python基础5(文件操作,with语句)

    打开文件 #使用 open f = open('路径',mode = '打开模式', encoding='编码') #可以使用with语句打开,不需要关闭,可以同时打开多个文件 with open(' ...

  10. POJ——T 3687 Labeling Balls

    http://poj.org/problem?id=3687 Time Limit: 1000MS   Memory Limit: 65536K Total Submissions: 14842   ...