Giter Club home page Giter Club logo

babel-preset-rsuite's Introduction

babel-preset-rsuite

Modularly import rsuite components for babel.

dependencies:

Install

$ npm i --save rsuite@next
$ npm i --save-dev babel-preset-rsuite@next

Usage

.babelrc

{
    "presets": ["rsuite"]
}

Transforms

import { Button } from 'rsuite';

roughly to

var _Button = require('rsuite/lib/Button');

With styles

.babelrc

{
    "presets": [["rsuite", { style: true }]]
}

Transforms

import { Button } from 'rsuite';

roughly to

require('rsuite/lib/Button/styles/index.less');
var _Button = require('rsuite/lib/Button');

Use theme styles

.babelrc

{
    "presets": [["rsuite", { style: true, theme: 'dark' }]]
}

Transforms

import { Button } from 'rsuite';

roughly to

require('rsuite/lib/Button/styles/themes/dark.less');
var _Button = require('rsuite/lib/Button');

babel-preset-rsuite's People

Contributors

simonguo avatar

Stargazers

avatar avatar avatar

Watchers

avatar avatar avatar

babel-preset-rsuite's Issues

Encountered an Error: Can't resolve 'rsuite/lib/styles/button'

Hi, webpack is throwing me the Error: Can't resolve 'rsuite/lib/styles/button'.

I suppose this repo is somehow out of date, as the docs(https://rsuitejs.com/en/guide/modularized) stated:

import { Button } from 'rsuite'; should be translated to require('rsuite/lib/Button/styles/themes/dark.less'); with .babelrc set to { "presets": [["rsuite", { "style": true, "theme": "dark" }]] }.

while this repo stated that the same code will be translated to require('rsuite/styles/button.less');

FIY:

"rsuite": "^4.0.0",
"babel-preset-rsuite": "^0.1.1",

Recommend Projects

  • React photo React

    A declarative, efficient, and flexible JavaScript library for building user interfaces.

  • Vue.js photo Vue.js

    🖖 Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.

  • Typescript photo Typescript

    TypeScript is a superset of JavaScript that compiles to clean JavaScript output.

  • TensorFlow photo TensorFlow

    An Open Source Machine Learning Framework for Everyone

  • Django photo Django

    The Web framework for perfectionists with deadlines.

  • D3 photo D3

    Bring data to life with SVG, Canvas and HTML. 📊📈🎉

Recommend Topics

  • javascript

    JavaScript (JS) is a lightweight interpreted programming language with first-class functions.

  • web

    Some thing interesting about web. New door for the world.

  • server

    A server is a program made to process requests and deliver data to clients.

  • Machine learning

    Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.

  • Game

    Some thing interesting about game, make everyone happy.

Recommend Org

  • Facebook photo Facebook

    We are working to build community through open source technology. NB: members must have two-factor auth.

  • Microsoft photo Microsoft

    Open source projects and samples from Microsoft.

  • Google photo Google

    Google ❤️ Open Source for everyone.

  • D3 photo D3

    Data-Driven Documents codes.