dva 中使用 'and-mobile' ，按需加载，样式不起作用

在使用 antd-mobile中，加载组件及组件的样式有多种引入方式，手动引入和按需加载(官方推荐的使用方式)。

一、按需加载

1、使用npm 安装babel-plugin-import： npm i --save-dev babel-plugin-import;
2、在 .babelrc 中加入如下配置：

// .babelrc or babel-loader option
{
  "plugins": [
    ["import", { libraryName: "antd-mobile", style: "css" }] // style: true`会加载 less 文件
  ]
}

3、然后只需从 antd-mobile 引入模块即可，无需单独引入样式。

// babel-plugin-import 会帮助你加载 JS 和 CSS
import { DatePicker } from 'antd-mobile';

奇怪的是，你会发现明明一样的配置却加载不出样式，翻来覆去，颠来倒去地检查，网上搜索答案 还是找不到原因。今天我将如上配置 放置 .roadhogrc 中，便可以正常加载出antd-mobile的样式了，以下是我的配置：

{
  "entry": "src/index.js",
  "env": {
    "development": {
      "extraBabelPlugins": [
        "dva-hmr",
        "transform-runtime",
        [
          "import", {
              "libraryName": "antd-mobile",
              "style": true  // `style: true` 会加载 less 文件
          }
        ]
      ]
    },
    "production": {
      "extraBabelPlugins": [
        "transform-runtime",
        [
            "import", {
                "libraryName": "antd-mobile",
                "style": true  // `style: true` 会加载 less 文件
            }
        ]
      ]
    }
  }
}

二、手动引入

import DatePicker from 'antd-mobile/lib/date-picker';  // 加载 JS
import 'antd-mobile/lib/date-picker/style/css';        // 加载 CSS