Adding some babel script to .babelrc?

There’s a UI framework called ant-design-mobile that requires an installation of babel-plugin-import

npm install babel-plugin-import --save-dev

and adding a line to the .babelrc file:

{“plugins”: [[“import”, { “libraryName”: “antd-mobile” }]]}

Does it still need ejecting to get the new babel settings to work? I was considering that framework, but if it required ejecting I probably wouldn’t use it.

You shouldn’t need to eject to get different babel settings to work.

First, install antd. You can do next steps if you want to build for production:

  1. install the required babel plugins:
    npm install babel-plugin-import --save-dev

  2. via text editor open node_modules/babel-preset-react-app/index.js

  3. find the text ‘const plugins = [’

  4. just add the next line with the following text:
    [
    require.resolve(‘babel-plugin-import’),
    {
    “libraryName”: “antd”,
    “libraryDirectory”: “lib”, // default: lib
    “style”: true
    },
    {
    “libraryName”: “antd-mobile”
    },
    ],

  5. save the file and run ‘npm run build’

You should now have the smaller minified files without ejecting or breaking your create-react-app script.
Just remember that you have to do the same thing again if you remove your node_modules folder.