a babel plugin that can transform generator function to state machine, which is a ported version of typescript generator transform

Overview

Babel Plugin Lite Regenerator

intro

This babel plugin is a ported version of TypeScript generator transform. It can transform async and generator function to state machine using the way of TypeScirpt.

Babel uses regenerator-transform whose helper function is about 6.6kB, but that of TypeScript just is about 1.1KB. Therefore, this plugin can decrease the bundle size if the project need to polyfill.

NOTICE

  • this plugin doesn't implement the prototype of generator function.

playground

babel-plugin-lite-regenerator-playground

install

$ npm install babel-plugin-lite-regenerator

usage

require("@babel/core").transformSync(code, {
  plugins: [
    // sometimes need cooperate with below plugin
    // '@babel/plugin-transform-destructuring',
    // '@babel/plugin-transform-spread',
    // '@babel/plugin-transform-parameters',
    // '@babel/plugin-transform-classes',
    // "@babel/plugin-transform-for-of",

    // most time need cooperate with this plugin
    "@babel/plugin-transform-block-scoping",
    
    require("babel-plugin-lite-regenerator")
  ]
});

or

require("@babel/core").transformSync(code, {
  presets: [
    require('babel-plugin-lite-regenerator').babelPresetLiteRegenerator
  ]
});
You might also like...

Transform SVGs into React components ๐Ÿฆ

Transform SVGs into React components ๐Ÿฆ

Transform SVGs into React components ๐Ÿฆ Try it out online! Watch the talk at React Europe SVGR transforms SVG into ready to use components. It is part

Jan 3, 2023

๐Ÿฅ A very simple way to transform antd table to xlsx

๐Ÿฅ A very simple way to transform antd table to xlsx

antd-table-2-xlsx antd-table-2-xlsx A very simple way to transform antd table to xlsx . Get Start! Install pnpm add @sudongyuer/antd-table-2-xlsx Usa

Aug 15, 2022

A Higher Order Component using react-redux to keep form state in a Redux store

A Higher Order Component using react-redux to keep form state in a Redux store

redux-form You build great forms, but do you know HOW users use your forms? Find out with Form Nerd! Professional analytics from the creator of Redux

Jan 3, 2023

Recoil is an experimental state management library for React apps. It provides several capabilities that are difficult to achieve with React alone, while being compatible with the newest features of React.

Recoil ยท Recoil is an experimental set of utilities for state management with React. Please see the website: https://recoiljs.org Installation The Rec

Jan 8, 2023

๐Ÿป Bear necessities for state management in React

๐Ÿป Bear necessities for state management in React

A small, fast and scaleable bearbones state-management solution. Has a comfy api based on hooks, isn't boilerplatey or opinionated, but still just eno

Jan 9, 2023

๐Ÿ High performance subscription-based form state management for React

๐Ÿ High performance subscription-based form state management for React

You build great forms, but do you know HOW users use your forms? Find out with Form Nerd! Professional analytics from the creator of React Final Form.

Jan 7, 2023

A state management library for React, heavily inspired by vuex

A state management library for React, heavily inspired by vuex

Vuex - But for React! โš› If you know vuex, you know it's as close as we get to a perfect state management library. What if we could do this in the reac

Sep 8, 2022

Real state property listing app using next.js , chakra.ui, SCSS

Real state property listing app using next.js , chakra.ui, SCSS

This is a Next.js project bootstrapped with create-next-app. Getting Started First, run the development server: npm run dev # or yarn dev Open http://

Dec 19, 2021

This hook allows you to isolate and manage the state within the component, reducing rendering operations and keeping the source code concise.

React Hook Component State This hook allows you to isolate and manage the state within the component, reducing rendering operations and keeping the so

May 15, 2022
Owner
Shi Meng
Shi Meng
Create a performant distributed context state by synergyzing atomar context pieces and composing reusable state logic.

Synergies Create a performant distributed context state by synergyzing atomar context pieces and composing reusable state logic. synergies is a tiny (

Lukas Bach 8 Nov 8, 2022
A complete set up of the React application with Typescript, Webpack 5, Babel v7, SSR, Code Splitting and HMR.

Getting Started with react-final-boilerplate Clone the code npm install You are good to go with React Application. Open http://localhost:3000/ and you

null 24 Dec 22, 2022
Babel Plugin Lite Regenerator

Babel Plugin Lite Regenerator intro This babel plugin is a ported version of TypeScript generator transform. It can transform async and generator func

Shi Meng 6 Jul 8, 2022
React Starter Kit โ€” isomorphic web app boilerplate (Node.js, Express, GraphQL, React.js, Babel, PostCSS, Webpack, Browsersync)

React Starter Kit โ€” "isomorphic" web app boilerplate React Starter Kit is an opinionated boilerplate for web development built on top of Node.js, Expr

Kriasoft 21.7k Dec 30, 2022
React + Redux starter kit / boilerplate with Babel, hot reloading, testing, linting and a working example app built in

A comprehensive starter kit for rapid application development using React. Why Slingshot? One command to get started - Type npm start to start develop

Cory House 9.8k Dec 22, 2022
React Native's Global Alert Component that can be fully customized and without the need of a state.

?? React Native Easy Alert React Native Easy Alert Component. Watch on youtube Easy Alert example app. React Native's Global Alert Component that can

null 9 Feb 21, 2022
Edvora App is a web application based on an external API, showing data about different types of products and the user can filter these data by choosing a specific state, city or product name. Build with React.js

Edvora App is a web application based on an external API, showing data about different types of products and the user can filter these data by choosing a specific state, city or product name. Build with React.js

Kyrillos Hany 5 Mar 11, 2022
use this to replace redux,you can use useActions to change context value and useActions return a mutable function collection

English | ไธญๆ–‡ NOTE react-context-mutation is a lighter and more convenient state manager designed for react applications. It aims to replace the Redux

null 19 Feb 22, 2022
A lite version for the my original app loki stream which allowed watching anime on your phone. Made using expo.

LokiStream Lite A lite version for the my original app loki stream. This app is faster, smaller and more optimized for your phone. It allows you to wa

Lavish Kumar 18 Dec 24, 2022
Based on pure JS scripts, without relying on native, no need for react-native link, Title / Header / Tabs / Sticky / Screen components can be flexibly configured, among which Tabs / Sticky can slide When it reaches the top, it will be topped.

react-native-scrollable-tabview English | ็ฎ€ไฝ“ไธญๆ–‡ Based on pure JS scripts, without relying on native, no need for react-native link,Title / Header / Tab

null 136 Dec 30, 2022