fix: webpack config

example/.gitignore

@@ -0,0 +1,16 @@
+.idea
+.vscode
+.DS_Store
+web-build/
+web-report/
+
+node_modules/*
+dist/*
+.expo/*
+npm-debug.*
+*.log
+
+/beta
+
+.expo-shared/
+yarn.lock

example/README.md

@@ -0,0 +1,34 @@
+
+
+<p align="center">
+  <a href="http://rn.mobile.ant.design">
+    <img width="320" src="https://zos.alipayobjects.com/rmsportal/wIjMDnsrDoPPcIV.png">
+  </a>
+</p>
+
+# Ant Design Mobile RN Example
+
+<iframe src="https://1uokun.github.io/ant-design-mobile-rn/index.html" width="375" height="667"></iframe>
+
+## Demo
+
+**Preview in [ 🔗 Web Platform](https://1uokun.github.io/ant-design-mobile-rn/index.html)**. or<br>
+**Download our Expo demo app** <br>
+[<img width="250" alt="expo/ant-design-mobile-rn" src="https://qr.expo.dev/expo-go?owner=1uokun&slug=ant-design-mobile-rn&releaseChannel=default&host=exp.host" />](https://expo.dev/@1uokun/ant-design-mobile-rn) <br>
+> Open the camera app on your device and scan the code above, <br>
+need install expo app: https://expo.io/tools
+
+```bash
+# go to example folder
+cd example
+
+# install dependencies
+yarn
+
+# start expo
+yarn expo
+
+# › Press a │ open Android
+# › Press i │ open iOS simulator
+# › Press w │ open web
+```

app.json → example/app.json

@@ -5,8 +5,8 @@
     "name": "@ant-design/react-native",
     "slug": "ant-design-mobile-rn",
     "description": "基于蚂蚁金服移动设计规范的 React Native 组件库",
-    "icon": "./rn-kitchen-sink/android/app/src/main/res/mipmap-xhdpi/ic_launcher.png",
+    "icon": "../rn-kitchen-sink/android/app/src/main/res/mipmap-xhdpi/ic_launcher.png",
     "version": "5.0.0",
-    "entryPoint": "./expo/index.js"
+    "entryPoint": "index.js"
   }
 }

example/babel.config.js

@@ -0,0 +1,6 @@
+module.exports = function (api) {
+  api.cache(true)
+  return {
+    presets: ['babel-preset-expo', 'module:metro-react-native-babel-preset'],
+  }
+}

expo/index.js → example/index.js

@@ -1,5 +1,5 @@
-import 'expo-dev-client'
 import { registerRootComponent } from 'expo'
+import 'expo-dev-client'
 import App from './App'
 
 registerRootComponent(App)

example/package.json

@@ -0,0 +1,34 @@
+{
+  "name": "react-native-elements-app",
+  "version": "1.1.0",
+  "description": "Demo app for React Native Elements UI Library",
+  "author": "Monte Thakkar",
+  "private": true,
+  "homepage": "https://react-native-elements.github.io/react-native-elements-app/",
+  "main": "./index.js",
+  "scripts": {
+    "start": "EXPO_NO_TYPESCRIPT_SETUP=1 expo start",
+    "android": "expo start --android",
+    "ios": "expo start --ios",
+    "web": "expo start --web",
+    "eject": "expo eject",
+    "build:web": "expo build:web --config ./app.web-build.json --polyfill",
+    "deploy": "gh-pages -d web-build",
+    "prettify": "prettier --write .  --config ./.prettierrc",
+    "lint": "eslint --ext js,ts,tsx ."
+  },
+  "dependencies": {
+    "@babel/preset-typescript": "^7.16.7",
+    "expo": "^44.0.6",
+    "expo-app-loading": "~1.3.0",
+    "expo-dev-client": "^0.8.4",
+    "expo-font": "~10.0.4",
+    "react": "17.0.2"
+  },
+  "devDependencies": {
+    "@expo/webpack-config": "~0.16.2",
+    "babel-loader": "^8.2.5",
+    "babel-preset-expo": "9.0.2",
+    "jest-expo": "^44.0.1"
+  }
+}

example/webpack.config.js

@@ -0,0 +1,30 @@
+const createExpoWebpackConfigAsync = require('@expo/webpack-config')
+
+module.exports = async function (env, argv) {
+  const config = await createExpoWebpackConfigAsync(env, argv)
+
+  config.module.rules.push({
+    test: /\.(js|ts|tsx)$/,
+    exclude: /node_modules/,
+    use: 'babel-loader',
+  })
+
+  config.module.rules.push({
+    test: /\.(js)$/,
+    include: [/node_modules\/@bang88\/react-native-ultimate-listview/],
+    use: {
+      loader: 'babel-loader',
+      options: {
+        presets: [
+          [
+            '@babel/preset-env',
+            {
+              modules: false,
+            },
+          ],
+        ],
+      },
+    },
+  })
+  return config
+}

package.json

@@ -48,7 +48,6 @@
     "@ant-design/tools": "^13.4.1-beta.0",
     "@babel/core": "^7.12.9",
     "@babel/runtime": "^7.12.5",
-    "@expo/webpack-config": "^0.16.18",
     "@react-native-community/cameraroll": "^4.0.4",
     "@react-native-community/eslint-config": "^2.0.0",
     "@react-native-community/masked-view": "^0.1.9",
@@ -75,10 +74,6 @@
     "cross-env": "^7.0.3",
     "enquire.js": "^2.1.1",
     "eslint": "^7.28.0",
-    "expo": "^44.0.6",
-    "expo-app-loading": "~1.3.0",
-    "expo-dev-client": "^0.8.4",
-    "expo-font": "~10.0.4",
     "glob": "^7.1.1",
     "jest": "^26.6.3",
     "jsonml.js": "^0.1.0",
@@ -134,7 +129,6 @@
     "android": "concurrently \"npm run watch-tsc\" \"npm run _android\"",
     "_ios": "npx react-native run-ios --project-path rn-kitchen-sink/ios --scheme KitchenSink",
     "_android": "react-native run-android",
-    "expo": "EXPO_NO_TYPESCRIPT_SETUP=1 expo start",
     "lint-staged": "lint-staged",
     "lint-staged:ts": "npm run tsc && eslint components/**/*.tsx",
     "lint-staged:es": "eslint ./.eslintrc.js",

rn-kitchen-sink/components/index.js

@@ -1,7 +1,7 @@
 /* eslint no-console:0 */
-import { List, SearchBar } from '@ant-design/react-native'
 import React from 'react'
 import { ScrollView, StyleSheet, View } from 'react-native'
+import { List, SearchBar } from '../../components'
 import { OTHERS, UIBARS, UICONTROLS, UIVIEWS } from '../demoList'
 import Theme from './Theme'
 

webpack.config.js

@@ -1,25 +1,4 @@
-const createExpoWebpackConfigAsync = require('@expo/webpack-config')
+const getWebpackConfig = require('@ant-design/tools/lib/getWebpackConfig.js')
+const webpackConfig = getWebpackConfig(false)
 
-module.exports = async function (env, argv) {
-  const config = await createExpoWebpackConfigAsync(env, argv)
-  // Customize the config before returning it.
-  config.module.rules.push({
-    test: /\.(js)$/,
-    include: [/node_modules\/@bang88\/react-native-ultimate-listview/],
-    use: {
-      loader: 'babel-loader',
-      options: {
-        presets: [
-          [
-            '@babel/preset-env',
-            {
-              modules: false,
-            },
-          ],
-        ],
-      },
-    },
-  })
-  config.output.publicPath = './'
-  return config
-}
+module.exports = webpackConfig