Modularized antd-mobile doesn't work in my project(nextjs9.1.6 with typescript)

[juanjuan2wei]

this is my .babelrc file

{
  "presets": ["next/babel"],
  "plugins": [
    ["@babel/plugin-transform-typescript", { "allowNamespaces": true }],
    [
      "import",
      {
        "libraryName": "antd-mobile",
        "style": "css"
      }
    ]
  ]
}

it doesn't work, and the project still warn ' You are using a whole package of antd-mobile'

I think maybe I can resolve this problem if I use the ts-import-plugin, but nextjs @9 is zero typscript config, I can't find where to use it, here's some ts-import-plugin api:

// webpack.config.js
const tsImportPluginFactory = require('ts-import-plugin')

module.exports = {
  // ...
  module: {
    rules: [
      {
        test: /\.(jsx|tsx|js|ts)$/,
        loader: 'ts-loader',
        options: {
          transpileOnly: true,
          getCustomTransformers: () => ({
            before: [ tsImportPluginFactory( /** options */) ]
          }),
          compilerOptions: {
            module: 'es2015'
          }
        },
        exclude: /node_modules/
      }
    ]
  },
  // ...
}

and what can I do next?

[juanjuan2wei]

Finally I find the answer, it's not about nextjs.

I find some code in this project, here it is :

export { DatePicker, Toast, ActionSheet, Carousel, TextareaItem } from 'antd-mobile'

now babel-plugin-import can translate import xxx from 'antd-mobile' to var xxx = require('antd-mobile/lib/xxx'),bu meet the first word 'export', it will not work.
so although I had wrote the Modularized antd-mobile setting in my .babelrc file, the whole package warning still exist.