react-touch-ripple icon indicating copy to clipboard operation
react-touch-ripple copied to clipboard

babel version

Open mberatsanli opened this issue 3 years ago • 5 comments

Hello, I like your library but I got an error when using the library in a different project. We use the @babel/runtime in our project. But this library uses old babel imports.

I got this error when running the storybook.

Module not found: Error: Can't resolve 'babel-runtime/helpers/possibleConstructorReturn' in '/Users/melih/OUR_PROJECT/frontend/OUR_COMMON_LIBRARY/node_modules/react-touch-ripple/es'

Can you update the babel version? By the way, I don't know if there is a plugin for this, I searched but couldn't find it, I'm very new to FE. I'm a BE dev.

mberatsanli avatar Jun 03 '21 09:06 mberatsanli

ping @froyog

mberatsanli avatar Jun 08 '21 13:06 mberatsanli

hi @mberatsanli , I'm not sure the issue is related to the babel version of react-touch-ripple.

Are you using storybook as a boilerplate? What version of babel/runtime and storybook do you have? Please provide more reproduction info so I can give a closer look on this.

froyog avatar Jun 08 '21 14:06 froyog

Hi @froyog,

Are you using storybook as a boilerplate

Yeap, also I faced this error when deploying and starting as well yarn start or yarn build

What version of babel/runtime and storybook do you have?

    "@storybook/react: "^6.0.22"
    "neutrino-preset-storybook-react": "^1.0.2",
    "@babel/cli": "^7.12.10",
    "@babel/plugin-transform-runtime": "^7.12.10",
    "@babel/runtime": "7.12.13",
    "@babel/runtime-corejs3": "7.12.13"

I'm using the neutrinojs for configuration.. For babel, storybook and webpack


Extra Notes:

  1. i can solve this problem just by using "babel-runtime", but i don't want to use it, I couldn't find any solution on the internet.

  2. When I change the babel-runtime import as @babel/runtime. It works. Screen Shot 2021-06-11 at 04 00 01

mberatsanli avatar Jun 11 '21 08:06 mberatsanli

Hi @mberatsanli

Tried this on my local machine and the problem is caused by babel changing how babel-runtime works in babel@7. So, I think for now, you can solve this problem by npm i -D babel-runtime. I don't know why you don't want to use it since many react boilerplate (eg. create-react-app) are using babel-runtime and @babel/runtime at the same time. You can keep everything else in your project intact.

As for react-touch-ripple, I will upgrade babel version to babel 7 recently (a bit busy lately, so maybe next week). And a PR is always welcomed.

froyog avatar Jun 16 '21 12:06 froyog

Hello @froyog , I'm not very familiar with the babel stuff so I want to write the project in a very clean way, I will add babel-runtime temporarily, and open a PR for this library over the weekend

mberatsanli avatar Jun 17 '21 09:06 mberatsanli