https://github.com/fatalxiao/babel-plugin-transform-import-sync

A babel plugin to transform async import to sync
https://github.com/fatalxiao/babel-plugin-transform-import-sync

babel import plugin transform

Last synced: 26 days ago
JSON representation

A babel plugin to transform async import to sync

• Host: GitHub
• URL: https://github.com/fatalxiao/babel-plugin-transform-import-sync
• Owner: fatalxiao
• License: mit
• Created: 2018-07-06T08:25:40.000Z (over 6 years ago)
• Default Branch: master
• Last Pushed: 2018-08-31T04:51:21.000Z (about 6 years ago)
• Last Synced: 2024-09-29T06:22:16.003Z (about 1 month ago)
• Topics: babel, import, plugin, transform
• Language: JavaScript
• Homepage:
• Size: 22.5 KB
• Stars: 1
• Watchers: 1
• Forks: 0
• Open Issues: 0
• Metadata Files:
  • Readme: README.md
  • License: LICENSE

Awesome Lists containing this project

README

        
# babel-plugin-transform-import-sync

[![CircleCI Status][circleci-image]][circleci-url]

[![NPM Version][npm-image]][npm-url]

[![License][license-image]][npm-url]

[circleci-image]: https://circleci.com/gh/fatalxiao/babel-plugin-transform-import-sync.svg?longCache=true&style=shield&circle-token=:circle-token

[circleci-url]: https://circleci.com/gh/fatalxiao/babel-plugin-transform-import-sync

[npm-image]: https://img.shields.io/npm/v/babel-plugin-transform-import-sync.svg?longCache=true&style=shield

[npm-url]: https://npmjs.org/package/babel-plugin-transform-import-sync

[license-image]: https://img.shields.io/npm/l/babel-plugin-transform-import-sync.svg?longCache=true&style=shield

A babel plugin to transform async import to sync.

## Installation

**NPM**

```bash

$ npm install babel-plugin-transform-import-sync --save-dev

```

## Usage

In `.babelrc`.

```json

{

    "presets": [

        "env",

        "stage-0",

        "react"

    ],

    "env": {

        "development": {

            "presets": [

                "react-hmre"

            ],

            "plugins": [

                "syntax-dynamic-import",

                "transform-import-sync"

            ]

        }

    },

    "plugins": [

        "transform-runtime",

        "transform-decorators-legacy"

    ]

}

```

## Example

Async component import like this:

```js

import asyncComponent from 'components/AsyncComponent';

export default [{

    path: '/',

    component: asyncComponent(() => import('containers/Root'))

}];

```

will be transformed to sync:

```js

import asyncComponent from 'components/AsyncComponent';

export default [{

    path: '/',

    component: asyncComponent(() => (function() {

        const component = require('containers/Root');

        return component.default || component;

    })())

}];

```