Webpack + babel issues

Hi, I’m trying to use your library in our project with webpack + babel setup but I’ve come into several issues.

a) When I try to import it as suggested in README:

import Cleave from 'cleave.js/react';

I get following error in web console: Uncaught SyntaxError: Unexpected token import in react.js:1

b) And when I try to include the dist directly:

import Cleave from 'cleave.js/dist/cleave-react';

I get webpack error:

WARNING in ./~/cleave.js/dist/cleave-react.js
Critical dependencies:
1:113-120 This seems to be a pre-built javascript file. Though this is possible, it's not recommended. Try to require the original source to get better results.
 @ ./~/cleave.js/dist/cleave-react.js 1:113-120

Thank you, Michael

[nosir]

Final improvement in v0.5.2: It’s not dist/cleave-react.webpack anymore, just use dist/cleave-react.

Turns out Browserify project works well with bundled Webpack script. So we just use webpack to build react bundle.

It should work for all the cases you need. Also updated doc here: https://github.com/nosir/cleave.js/blob/master/doc/reactjs-component-usage.md:

[hitchcockwill]

With a create-react-app app the following import worked for me:

import Cleave from 'cleave.js/dist/cleave-react'
import CleavePhone from 'cleave.js/dist/addons/cleave-phone.us'

Note that I dropped the .webpack suffix mentioned above.