unable to resolve module `react-dom`

Version

2.0.2

Environment

系统版本macOS 10.12.6, react-native 0.47

Reproduction link

https://github.com/yiminghe/css-animation/blob/master/src/Event.js#L22

Steps to reproduce

在项目中运行npm install --save antd-mobile，获得依赖库如下

在项目中使用 import { Toast} from ‘antd-mobile’;

Toast.info(message, 1) 但是运行时出现依赖react-dom的错误

"Unable to resolve module react-dom from `/Users/xiesubin/Workspace/Project/seller-pad-rn/node_modules/rc-animate/lib/AnimateChild.js

使用 npm install --save react-dom安装依赖后，会再出现 document.createElement not defined错误， 报错位置为css-animation/blob/master/src/Event.js 22 https://github.com/yiminghe/css-animation/blob/master/src/Event.js#L22 怀疑是antd-mobile的依赖库的问题

What is expected?

期望的结果是不报错

What is actually happening?

"Unable to resolve module react-dom from `/Users/xiesubin/Workspace/Project/seller-pad-rn/node_modules/rc-animate/lib/AnimateChild.js

---

项目的依赖库如下：

"dependencies": {
		"antd-mobile": "^2.0.2",
		"axios": "^0.16.2",
		"immutable": "^3.8.2",
		"moment": "^2.19.1",
		"numeral": "^2.0.6",
		"react": "16.0.0-alpha.12",
		"react-native": "0.47.0",
		"react-native-actioncable": "0.0.3",
		"react-native-actionsheet": "^2.3.0",
		"react-native-code-push": "^5.1.0-beta",
		"react-native-qrcode": "^0.2.3",
		"react-native-snap-carousel": "^3.4.0",
		"react-native-ui-kitten": "^2.0.1",
		"react-native-vector-icons": "^4.4.2",
		"react-native-version-number": "^0.3.0",
		"react-navigation": "^1.0.0-beta.19",
		"react-redux": "^5.0.6",
		"redux": "^3.7.2",
		"redux-immutable": "^4.0.0",
		"redux-logger": "^3.0.6",
		"redux-persist-immutable": "^4.3.1",
		"redux-thunk": "^2.2.0",
		"remote-redux-devtools": "^0.5.12",
		"reselect": "^3.0.1"
	},

[arniu]

@zim-lee @zxj963577494 非常感谢，我也成功了~

我这没有用 crna，所以 preset 是 react-native。查看 babel-preset-expo 源码，发现比 babel-preset-react-native 多个插件 babel-plugin-module-resolver。

总结下来，如果直接使用 react-native，antd-mobile 的安装过程如下：

1. npm i antd-mobile

2. npm i -D babel-plugin-import babel-plugin-module-resolver

3. update .babelrc:

{
  "presets": ["react-native"],
  "plugins": [["import", { "libraryName": "antd-mobile" }]],
  "env": {
    "development": {
      "plugins": ["transform-react-jsx-source"]
    }
  }
}

@sorrycc 貌似 babel-plugin-import 用到了 babel-plugin-module-resolver，但是没有检查~

[silentcloud]

@wanxsb 看文档 https://mobile.ant.design/docs/react/introduce-cn#按需加载

如果不使用 babel-plugin-import 就需要写成

import Toast from 'antd-mobile/lib/toast';
import List from 'antd-mobile/lib/list';