From d7ce58c523dc904d726ebb4d4ee45d9f231d30f1 Mon Sep 17 00:00:00 2001 From: caihuanyu Date: Fri, 8 Nov 2019 11:04:15 +0800 Subject: [PATCH 1/2] =?UTF-8?q?refactor:=20=E5=8E=BB=E9=99=A4=20optionalPr?= =?UTF-8?q?omisify?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit 由于type定义很多本身必填的 option 其实也是不需要的，所以不如去掉 optionalPromisify，给 promisify 的 option 加个默认值 --- packages/remax/src/adapters/toutiao/api.ts | 39 +++---- packages/remax/src/adapters/wechat/api.ts | 130 ++++++++++----------- packages/remax/src/utils/promisify.ts | 26 +---- 3 files changed, 80 insertions(+), 115 deletions(-) diff --git a/packages/remax/src/adapters/toutiao/api.ts b/packages/remax/src/adapters/toutiao/api.ts index 414263dbe..fd38bfa7c 100644 --- a/packages/remax/src/adapters/toutiao/api.ts +++ b/packages/remax/src/adapters/toutiao/api.ts @@ -1,10 +1,9 @@ -// TODO promise 化补充完整 -import promisify, { optionalPromisify } from '../../utils/promisify'; +import promisify from '../../utils/promisify'; export const getAppStub = getApp; export const getSystemInfoSync = tt.getSystemInfoSync; -export const getSystemInfo = optionalPromisify(tt.getSystemInfo); +export const getSystemInfo = promisify(tt.getSystemInfo); export const getUpdateManager = tt.getUpdateManager; export const getLaunchOptionsSync = tt.getLaunchOptionsSync; export const exitMiniProgram = tt.exitMiniProgram; @@ -34,10 +33,10 @@ export const removeStorageSync = tt.removeStorageSync; export const removeStorage = promisify(tt.removeStorage); export const getStorageSync = tt.getStorageSync; export const getStorageInfoSync = tt.getStorageInfoSync; -export const getStorageInfo = optionalPromisify(tt.getStorageInfo); +export const getStorageInfo = promisify(tt.getStorageInfo); export const getStorage = promisify(tt.getStorage); export const clearStorageSync = tt.clearStorageSync; -export const clearStorage = optionalPromisify(tt.clearStorage); +export const clearStorage = promisify(tt.clearStorage); export const saveImageToPhotosAlbum = promisify(tt.saveImageToPhotosAlbum); export const previewImage = promisify(tt.previewImage); export const getImageInfo = promisify(tt.getImageInfo); @@ -45,10 +44,10 @@ export const chooseImage = promisify(tt.chooseImage); export const saveVideoToPhotosAlbum = promisify(tt.saveVideoToPhotosAlbum); export const createVideoContext = tt.createVideoContext; export const chooseVideo = promisify(tt.chooseVideo); -export const openLocation = optionalPromisify(tt.openLocation); +export const openLocation = promisify(tt.openLocation); export const getLocation = promisify(tt.getLocation); -export const showShareMenu = optionalPromisify(tt.showShareMenu); -export const hideShareMenu = optionalPromisify(tt.hideShareMenu); +export const showShareMenu = promisify(tt.showShareMenu); +export const hideShareMenu = promisify(tt.hideShareMenu); export const createCanvasContext = tt.createCanvasContext; export const saveFile = promisify(tt.saveFile); export const removeSavedFile = promisify(tt.removeSavedFile); @@ -66,26 +65,26 @@ export const requestPayment = promisify(tt.requestPayment); export const authorize = tt.authorize; export const openSetting = tt.openSetting; export const getSetting = tt.getSetting; -export const chooseAddress = optionalPromisify(tt.chooseAddress); +export const chooseAddress = promisify(tt.chooseAddress); export const setClipboardData = promisify(tt.setClipboardData); export const getClipboardData = tt.getClipboardData; export const onNetworkStatusChange = tt.onNetworkStatusChange; -export const getNetworkType = optionalPromisify(tt.getNetworkType); +export const getNetworkType = promisify(tt.getNetworkType); export const makePhoneCall = promisify(tt.makePhoneCall); -export const stopAccelerometer = optionalPromisify(tt.stopAccelerometer); -export const startAccelerometer = optionalPromisify(tt.startAccelerometer); +export const stopAccelerometer = promisify(tt.stopAccelerometer); +export const startAccelerometer = promisify(tt.startAccelerometer); export const onAccelerometerChange = tt.onAccelerometerChange; -export const stopCompass = optionalPromisify(tt.stopCompass); -export const startCompass = optionalPromisify(tt.startCompass); +export const stopCompass = promisify(tt.stopCompass); +export const startCompass = promisify(tt.startCompass); export const onCompassChange = tt.onCompassChange; -export const scanCode = optionalPromisify(tt.scanCode); -export const vibrateShort = optionalPromisify(tt.vibrateShort); -export const vibrateLong = optionalPromisify(tt.vibrateLong); +export const scanCode = promisify(tt.scanCode); +export const vibrateShort = promisify(tt.vibrateShort); +export const vibrateLong = promisify(tt.vibrateLong); export const getExtConfigSync = tt.getExtConfigSync; -export const getExtConfig = optionalPromisify(tt.getExtConfig); +export const getExtConfig = promisify(tt.getExtConfig); export const createSelectorQuery = tt.createSelectorQuery; export const createIntersectionObserver = tt.createIntersectionObserver; export const createRewardedVideoAd = tt.createRewardedVideoAd; -export const getConnectedWifi = optionalPromisify(tt.getConnectedWifi); -export const setKeepScreenOn = optionalPromisify(tt.setKeepScreenOn); +export const getConnectedWifi = promisify(tt.getConnectedWifi); +export const setKeepScreenOn = promisify(tt.setKeepScreenOn); export const getMenuButtonLayout = tt.getMenuButtonLayout; diff --git a/packages/remax/src/adapters/wechat/api.ts b/packages/remax/src/adapters/wechat/api.ts index e3881cd99..b033f70cb 100644 --- a/packages/remax/src/adapters/wechat/api.ts +++ b/packages/remax/src/adapters/wechat/api.ts @@ -1,4 +1,4 @@ -import promisify, { optionalPromisify } from '../../utils/promisify'; +import promisify from '../../utils/promisify'; export const getAppStub = getApp; @@ -6,7 +6,7 @@ export const canIUse = wx.canIUse; export const base64ToArrayBuffer = wx.base64ToArrayBuffer; export const arrayBufferToBase64 = wx.arrayBufferToBase64; export const getSystemInfoSync = wx.getSystemInfoSync; -export const getSystemInfo = optionalPromisify(wx.getSystemInfo); +export const getSystemInfo = promisify(wx.getSystemInfo); export const getUpdateManager = wx.getUpdateManager; export const getLaunchOptionsSync = wx.getLaunchOptionsSync; export const onPageNotFound = wx.onPageNotFound; @@ -26,34 +26,30 @@ export const switchTab = promisify(wx.switchTab); export const reLaunch = promisify(wx.reLaunch); export const redirectTo = promisify(wx.redirectTo); export const navigateTo = promisify(wx.navigateTo); -export const navigateBack = optionalPromisify(wx.navigateBack); +export const navigateBack = promisify(wx.navigateBack); export const showToast = promisify(wx.showToast); export const showModal = promisify(wx.showModal); export const showLoading = promisify(wx.showLoading); export const showActionSheet = promisify(wx.showActionSheet); -export const hideToast = optionalPromisify(wx.hideToast); -export const hideLoading = optionalPromisify(wx.hideLoading); -export const showNavigationBarLoading = optionalPromisify( - wx.showNavigationBarLoading -); +export const hideToast = promisify(wx.hideToast); +export const hideLoading = promisify(wx.hideLoading); +export const showNavigationBarLoading = promisify(wx.showNavigationBarLoading); export const setNavigationBarTitle = promisify(wx.setNavigationBarTitle); export const setNavigationBarColor = promisify(wx.setNavigationBarColor); -export const hideNavigationBarLoading = optionalPromisify( - wx.hideNavigationBarLoading -); +export const hideNavigationBarLoading = promisify(wx.hideNavigationBarLoading); export const setBackgroundTextStyle = promisify(wx.setBackgroundTextStyle); export const setBackgroundColor = promisify(wx.setBackgroundColor); export const showTabBarRedDot = promisify(wx.showTabBarRedDot); export const showTabBar = promisify(wx.showTabBar); -export const setTabBarStyle = optionalPromisify(wx.setTabBarStyle); +export const setTabBarStyle = promisify(wx.setTabBarStyle); export const setTabBarItem = promisify(wx.setTabBarItem); export const setTabBarBadge = promisify(wx.setTabBarBadge); export const removeTabBarBadge = promisify(wx.removeTabBarBadge); export const hideTabBarRedDot = promisify(wx.hideTabBarRedDot); export const hideTabBar = promisify(wx.hideTabBar); export const loadFontFace = promisify(wx.loadFontFace); -export const stopPullDownRefresh = optionalPromisify(wx.stopPullDownRefresh); -export const startPullDownRefresh = optionalPromisify(wx.startPullDownRefresh); +export const stopPullDownRefresh = promisify(wx.stopPullDownRefresh); +export const startPullDownRefresh = promisify(wx.startPullDownRefresh); export const pageScrollTo = promisify(wx.pageScrollTo); export const createAnimation = wx.createAnimation; export const setTopBarText = promisify(wx.setTopBarText); @@ -73,8 +69,8 @@ export const onSocketMessage = wx.onSocketMessage; export const onSocketError = wx.onSocketError; export const onSocketClose = wx.onSocketClose; export const connectSocket = promisify(wx.connectSocket); -export const closeSocket = optionalPromisify(wx.closeSocket); -export const stopLocalServiceDiscovery = optionalPromisify( +export const closeSocket = promisify(wx.closeSocket); +export const stopLocalServiceDiscovery = promisify( wx.stopLocalServiceDiscovery ); export const startLocalServiceDiscovery = promisify( @@ -95,10 +91,10 @@ export const removeStorageSync = wx.removeStorageSync; export const removeStorage = promisify(wx.removeStorage); export const getStorageSync = wx.getStorageSync; export const getStorageInfoSync = wx.getStorageInfoSync; -export const getStorageInfo = optionalPromisify(wx.getStorageInfo); +export const getStorageInfo = promisify(wx.getStorageInfo); export const getStorage = promisify(wx.getStorage); export const clearStorageSync = wx.clearStorageSync; -export const clearStorage = optionalPromisify(wx.clearStorage); +export const clearStorage = promisify(wx.clearStorage); export const createMapContext = wx.createMapContext; export const saveImageToPhotosAlbum = promisify(wx.saveImageToPhotosAlbum); export const previewImage = promisify(wx.previewImage); @@ -109,44 +105,42 @@ export const chooseImage = promisify(wx.chooseImage); export const saveVideoToPhotosAlbum = promisify(wx.saveVideoToPhotosAlbum); export const createVideoContext = wx.createVideoContext; export const chooseVideo = promisify(wx.chooseVideo); -export const stopVoice = optionalPromisify(wx.stopVoice); +export const stopVoice = promisify(wx.stopVoice); export const setInnerAudioOption = promisify(wx.setInnerAudioOption); export const playVoice = promisify(wx.playVoice); -export const pauseVoice = optionalPromisify(wx.pauseVoice); -export const getAvailableAudioSources = optionalPromisify( - wx.getAvailableAudioSources -); +export const pauseVoice = promisify(wx.pauseVoice); +export const getAvailableAudioSources = promisify(wx.getAvailableAudioSources); export const createInnerAudioContext = wx.createInnerAudioContext; export const createAudioContext = wx.createAudioContext; -export const stopBackgroundAudio = optionalPromisify(wx.stopBackgroundAudio); +export const stopBackgroundAudio = promisify(wx.stopBackgroundAudio); export const seekBackgroundAudio = promisify(wx.seekBackgroundAudio); export const playBackgroundAudio = promisify(wx.playBackgroundAudio); -export const pauseBackgroundAudio = optionalPromisify(wx.pauseBackgroundAudio); +export const pauseBackgroundAudio = promisify(wx.pauseBackgroundAudio); export const onBackgroundAudioStop = wx.onBackgroundAudioStop; export const onBackgroundAudioPlay = wx.onBackgroundAudioPlay; export const onBackgroundAudioPause = wx.onBackgroundAudioPause; -export const getBackgroundAudioPlayerState = optionalPromisify( +export const getBackgroundAudioPlayerState = promisify( wx.getBackgroundAudioPlayerState ); export const getBackgroundAudioManager = wx.getBackgroundAudioManager; export const createLivePusherContext = wx.createLivePusherContext; export const createLivePlayerContext = wx.createLivePlayerContext; -export const stopRecord = optionalPromisify(wx.stopRecord); +export const stopRecord = promisify(wx.stopRecord); export const startRecord = promisify(wx.startRecord); export const getRecorderManager = wx.getRecorderManager; export const createCameraContext = wx.createCameraContext; -export const stopLocationUpdate = optionalPromisify(wx.stopLocationUpdate); -export const startLocationUpdateBackground = optionalPromisify( +export const stopLocationUpdate = promisify(wx.stopLocationUpdate); +export const startLocationUpdateBackground = promisify( wx.startLocationUpdateBackground ); -export const startLocationUpdate = optionalPromisify(wx.startLocationUpdate); +export const startLocationUpdate = promisify(wx.startLocationUpdate); export const openLocation = promisify(wx.openLocation); export const onLocationChange = wx.onLocationChange; export const getLocation = promisify(wx.getLocation); -export const chooseLocation = optionalPromisify(wx.chooseLocation); +export const chooseLocation = promisify(wx.chooseLocation); export const updateShareMenu = promisify(wx.updateShareMenu); export const showShareMenu = promisify(wx.showShareMenu); -export const hideShareMenu = optionalPromisify(wx.hideShareMenu); +export const hideShareMenu = promisify(wx.hideShareMenu); export const getShareInfo = promisify(wx.getShareInfo); export const createOffscreenCanvas = wx.createOffscreenCanvas; export const createCanvasContext = wx.createCanvasContext; @@ -156,12 +150,12 @@ export const canvasGetImageData = promisify(wx.canvasGetImageData); export const saveFile = promisify(wx.saveFile); export const removeSavedFile = promisify(wx.removeSavedFile); export const openDocument = promisify(wx.openDocument); -export const getSavedFileList = optionalPromisify(wx.getSavedFileList); +export const getSavedFileList = promisify(wx.getSavedFileList); export const getSavedFileInfo = promisify(wx.getSavedFileInfo); export const getFileSystemManager = wx.getFileSystemManager; export const getFileInfo = promisify(wx.getFileInfo); -export const login = optionalPromisify(wx.login); -export const checkSession = optionalPromisify(wx.checkSession); +export const login = promisify(wx.login); +export const checkSession = promisify(wx.checkSession); export const navigateToMiniProgram = promisify(wx.navigateToMiniProgram); export const navigateBackMiniProgram = promisify(wx.navigateBackMiniProgram); export const getAccountInfoSync = wx.getAccountInfoSync; @@ -170,33 +164,33 @@ export const reportMonitor = wx.reportMonitor; export const reportAnalytics = wx.reportAnalytics; export const requestPayment = promisify(wx.requestPayment); export const authorize = promisify(wx.authorize); -export const openSetting = optionalPromisify(wx.openSetting); -export const getSetting = optionalPromisify(wx.getSetting); -export const chooseAddress = optionalPromisify(wx.chooseAddress); +export const openSetting = promisify(wx.openSetting); +export const getSetting = promisify(wx.getSetting); +export const chooseAddress = promisify(wx.chooseAddress); export const openCard = promisify(wx.openCard); export const addCard = promisify(wx.addCard); -export const chooseInvoiceTitle = optionalPromisify(wx.chooseInvoiceTitle); -export const chooseInvoice = optionalPromisify(wx.chooseInvoice); +export const chooseInvoiceTitle = promisify(wx.chooseInvoiceTitle); +export const chooseInvoice = promisify(wx.chooseInvoice); export const startSoterAuthentication = promisify(wx.startSoterAuthentication); -export const checkIsSupportSoterAuthentication = optionalPromisify( +export const checkIsSupportSoterAuthentication = promisify( wx.checkIsSupportSoterAuthentication ); export const checkIsSoterEnrolledInDevice = promisify( wx.checkIsSoterEnrolledInDevice ); -export const getWeRunData = optionalPromisify(wx.getWeRunData); -export const stopBeaconDiscovery = optionalPromisify(wx.stopBeaconDiscovery); +export const getWeRunData = promisify(wx.getWeRunData); +export const stopBeaconDiscovery = promisify(wx.stopBeaconDiscovery); export const startBeaconDiscovery = promisify(wx.startBeaconDiscovery); export const onBeaconUpdate = wx.onBeaconUpdate; export const onBeaconServiceChange = wx.onBeaconServiceChange; -export const getBeacons = optionalPromisify(wx.getBeacons); -export const stopWifi = optionalPromisify(wx.stopWifi); -export const startWifi = optionalPromisify(wx.startWifi); +export const getBeacons = promisify(wx.getBeacons); +export const stopWifi = promisify(wx.stopWifi); +export const startWifi = promisify(wx.startWifi); export const setWifiList = promisify(wx.setWifiList); export const onWifiConnected = wx.onWifiConnected; export const onGetWifiList = wx.onGetWifiList; -export const getWifiList = optionalPromisify(wx.getWifiList); -export const getConnectedWifi = optionalPromisify(wx.getConnectedWifi); +export const getWifiList = promisify(wx.getWifiList); +export const getConnectedWifi = promisify(wx.getConnectedWifi); export const connectWifi = promisify(wx.connectWifi); export const addPhoneContact = promisify(wx.addPhoneContact); export const writeBLECharacteristicValue = promisify( @@ -216,7 +210,7 @@ export const getBLEDeviceCharacteristics = promisify( ); export const createBLEConnection = promisify(wx.createBLEConnection); export const closeBLEConnection = promisify(wx.closeBLEConnection); -export const stopBluetoothDevicesDiscovery = optionalPromisify( +export const stopBluetoothDevicesDiscovery = promisify( wx.stopBluetoothDevicesDiscovery ); export const startBluetoothDevicesDiscovery = promisify( @@ -228,52 +222,48 @@ export const onBluetoothAdapterStateChange = wx.onBluetoothAdapterStateChange; export const getConnectedBluetoothDevices = promisify( wx.getConnectedBluetoothDevices ); -export const getBluetoothDevices = optionalPromisify(wx.getBluetoothDevices); -export const getBluetoothAdapterState = optionalPromisify( - wx.getBluetoothAdapterState -); -export const closeBluetoothAdapter = optionalPromisify( - wx.closeBluetoothAdapter -); +export const getBluetoothDevices = promisify(wx.getBluetoothDevices); +export const getBluetoothAdapterState = promisify(wx.getBluetoothAdapterState); +export const closeBluetoothAdapter = promisify(wx.closeBluetoothAdapter); export const getBatteryInfoSync = wx.getBatteryInfoSync; -export const getBatteryInfo = optionalPromisify(wx.getBatteryInfo); +export const getBatteryInfo = promisify(wx.getBatteryInfo); export const setClipboardData = promisify(wx.setClipboardData); -export const getClipboardData = optionalPromisify(wx.getClipboardData); -export const stopHCE = optionalPromisify(wx.stopHCE); +export const getClipboardData = promisify(wx.getClipboardData); +export const stopHCE = promisify(wx.stopHCE); export const startHCE = promisify(wx.startHCE); export const sendHCEMessage = promisify(wx.sendHCEMessage); export const onHCEMessage = wx.onHCEMessage; -export const getHCEState = optionalPromisify(wx.getHCEState); +export const getHCEState = promisify(wx.getHCEState); export const onNetworkStatusChange = wx.onNetworkStatusChange; -export const getNetworkType = optionalPromisify(wx.getNetworkType); +export const getNetworkType = promisify(wx.getNetworkType); export const setScreenBrightness = promisify(wx.setScreenBrightness); export const setKeepScreenOn = promisify(wx.setKeepScreenOn); export const onUserCaptureScreen = wx.onUserCaptureScreen; -export const getScreenBrightness = optionalPromisify(wx.getScreenBrightness); +export const getScreenBrightness = promisify(wx.getScreenBrightness); export const makePhoneCall = promisify(wx.makePhoneCall); -export const stopAccelerometer = optionalPromisify(wx.stopAccelerometer); +export const stopAccelerometer = promisify(wx.stopAccelerometer); export const startAccelerometer = promisify(wx.startAccelerometer); export const onAccelerometerChange = wx.onAccelerometerChange; -export const stopCompass = optionalPromisify(wx.stopCompass); -export const startCompass = optionalPromisify(wx.startCompass); +export const stopCompass = promisify(wx.stopCompass); +export const startCompass = promisify(wx.startCompass); export const onCompassChange = wx.onCompassChange; -export const stopDeviceMotionListening = optionalPromisify( +export const stopDeviceMotionListening = promisify( wx.stopDeviceMotionListening ); export const startDeviceMotionListening = promisify( wx.startDeviceMotionListening ); export const onDeviceMotionChange = wx.onDeviceMotionChange; -export const stopGyroscope = optionalPromisify(wx.stopGyroscope); +export const stopGyroscope = promisify(wx.stopGyroscope); export const startGyroscope = promisify(wx.startGyroscope); export const onGyroscopeChange = wx.onGyroscopeChange; export const onMemoryWarning = wx.onMemoryWarning; export const scanCode = promisify(wx.scanCode); -export const vibrateShort = optionalPromisify(wx.vibrateShort); -export const vibrateLong = optionalPromisify(wx.vibrateLong); +export const vibrateShort = promisify(wx.vibrateShort); +export const vibrateLong = promisify(wx.vibrateLong); export const createWorker = wx.createWorker; export const getExtConfigSync = wx.getExtConfigSync; -export const getExtConfig = optionalPromisify(wx.getExtConfig); +export const getExtConfig = promisify(wx.getExtConfig); export const createSelectorQuery = wx.createSelectorQuery; export const createIntersectionObserver = wx.createIntersectionObserver; export const createRewardedVideoAd = wx.createRewardedVideoAd; diff --git a/packages/remax/src/utils/promisify.ts b/packages/remax/src/utils/promisify.ts index 4843ef51e..303cae27b 100644 --- a/packages/remax/src/utils/promisify.ts +++ b/packages/remax/src/utils/promisify.ts @@ -6,31 +6,7 @@ export interface PromisifyArgs { function promisify( api: (arg: Arg & PromisifyArgs) => void ) { - return (arg: Arg & PromisifyArgs) => { - return new Promise((resolve, reject) => { - api({ - ...arg, - success: (res: SuccessArg) => { - if (arg && typeof arg.success === 'function') { - arg.success(res); - } - resolve(res); - }, - fail: (res: FailArg) => { - if (arg && typeof arg.fail === 'function') { - arg.fail(res); - } - reject(res); - }, - }); - }); - }; -} - -export function optionalPromisify( - api: (arg?: Arg & PromisifyArgs) => void -) { - return (arg?: Arg & PromisifyArgs) => { + return (arg: Arg & PromisifyArgs = {} as Arg) => { return new Promise((resolve, reject) => { const promisifyArg: any = arg || { success: (res: SuccessArg) => { From edae15ef07be297a18b8e9cb94ae2ff141453bfc Mon Sep 17 00:00:00 2001 From: caihuanyu Date: Fri, 8 Nov 2019 12:47:30 +0800 Subject: [PATCH 2/2] =?UTF-8?q?feat:=20=E6=94=AF=E6=8C=81=E5=BC=80?= =?UTF-8?q?=E5=8F=91=E8=80=85=E6=B3=A8=E5=86=8C=20host=20=E7=BB=84?= =?UTF-8?q?=E4=BB=B6?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit 引入 remax.macro 注册 host 组件 resolve #293 --- .codesandbox/ci.json | 7 +- .prettierignore | 2 +- docs/guide/component.md | 43 ++ lint-staged.config.js | 5 +- package.json | 2 +- packages/babel-preset-remax/package.json | 3 +- packages/babel-preset-remax/src/index.ts | 1 + .../remax-cli/src/__tests__/build.test.ts | 16 + .../fixtures/alipay/expected/pages/index.axml | 31 -- .../fixtures/alipay/expected/pages/index.js | 1 + .../fixtures/assets/expected/pages/index.axml | 31 -- .../fixtures/assets/expected/pages/index.js | 1 + .../babelrc/expected/pages/index.axml | 31 -- .../fixtures/babelrc/expected/pages/index.js | 1 + .../expected/alipay/app.js | 1 + .../expected/alipay/app.json | 9 + .../expected/alipay/helper.sjs | 105 +++++ .../expected/alipay/pages/index.axml | 346 +++++++++++++++ .../expected/alipay/pages/index.js | 15 + .../expected/alipay/pages/index.json | 3 + .../expected/toutiao/app.js | 3 + .../expected/toutiao/app.json | 9 + .../expected/toutiao/base.ttml | 20 + .../expected/toutiao/pages/index.js | 19 + .../expected/toutiao/pages/index.json | 3 + .../expected/toutiao/pages/index.ttml | 2 + .../expected/wechat/app.js | 3 + .../expected/wechat/app.json | 9 + .../expected/wechat/base.wxml | 415 ++++++++++++++++++ .../expected/wechat/helper.wxs | 105 +++++ .../expected/wechat/pages/index.js | 19 + .../expected/wechat/pages/index.json | 3 + .../expected/wechat/pages/index.wxml | 3 + .../createHostComponent/src/app.config.js | 23 + .../fixtures/createHostComponent/src/app.js | 1 + .../createHostComponent/src/pages/index.js | 8 + .../customRootDir/expected/pages/index.axml | 31 -- .../customRootDir/expected/pages/index.js | 1 + .../disablePxToRpx/expected/pages/index.axml | 31 -- .../disablePxToRpx/expected/pages/index.js | 1 + .../nativeComponent/expected/pages/Hello.js | 1 + .../nativeComponent/expected/pages/Nihao.js | 1 + .../nativeComponent/expected/pages/index.axml | 367 +++++++++++++--- .../nativeComponent/expected/pages/index.js | 1 + .../expected/pages/index2.axml | 367 +++++++++++++--- .../nativeComponent/expected/pages/index2.js | 1 + .../fixtures/toutiao/expected/base.ttml | 14 +- .../fixtures/toutiao/expected/pages/index.js | 4 +- .../expected/alipay/components/Text.js | 1 + .../expected/alipay/components/View.js | 1 + .../universe/expected/alipay/pages/index.axml | 31 -- .../universe/expected/toutiao/base.ttml | 14 +- .../expected/toutiao/components/Text.js | 4 +- .../expected/toutiao/components/View.js | 4 +- .../universe/expected/toutiao/pages/index.js | 3 - .../universe/expected/wechat/base.wxml | 40 -- .../expected/wechat/components/Text.js | 1 + .../expected/wechat/components/View.js | 1 + .../fixtures/wechat/expected/base.wxml | 40 -- .../fixtures/wechat/expected/pages/index.js | 1 + .../src/__tests__/helpers/runTest.ts | 3 + .../adapters/alipay/hostComponents/index.ts | 74 ++++ .../src/build/adapters/alipay/index.ts | 9 +- .../remax-cli/src/build/adapters/index.ts | 4 +- .../adapters/toutiao/hostComponents/index.ts | 92 ++++ .../src/build/adapters/toutiao/index.ts | 9 +- .../adapters/wechat/hostComponents/index.ts | 92 ++++ .../src/build/adapters/wechat/index.ts | 9 +- .../remax-cli/src/build/plugins/components.ts | 41 +- .../remax-cli/templates/alipay/component.ejs | 7 +- .../remax-cli/templates/toutiao/component.ejs | 43 +- .../remax-cli/templates/wechat/component.ejs | 7 +- packages/remax.macro/.npmignore | 5 + packages/remax.macro/README.md | 1 + packages/remax.macro/jest.config.js | 18 + packages/remax.macro/package.json | 36 ++ .../remax.macro/src/createHostComponent.ts | 73 +++ packages/remax.macro/src/index.ts | 2 + packages/remax.macro/src/macro.ts | 29 ++ .../createHostComponent/imported/code.js | 4 + .../createHostComponent/imported/output.js | 2 + .../createHostComponent/multiple/code.js | 5 + .../createHostComponent/multiple/output.js | 4 + .../createHostComponent/namedImported/code.js | 4 + .../namedImported/output.js | 2 + .../createHostComponent/simple/code.js | 3 + .../createHostComponent/simple/output.js | 2 + packages/remax.macro/tests/index.test.ts | 10 + packages/remax.macro/tsconfig.json | 10 + packages/remax.macro/typings/index.d.ts | 1 + packages/remax/macro.d.ts | 1 + packages/remax/macro.js | 1 + packages/remax/package.json | 1 + packages/remax/src/Container.ts | 3 +- .../createRemaxComponent.test.tsx.snap | 7 + .../__tests__/createRemaxComponent.test.tsx | 15 + .../remax/src/__tests__/propsAlias.test.ts | 3 +- .../src/adapters/alipay/components/Button.ts | 4 +- .../src/adapters/alipay/components/Canvas.ts | 4 +- .../adapters/alipay/components/Checkbox.ts | 4 +- .../alipay/components/CheckboxGroup.ts | 4 +- .../alipay/components/ContactButton.ts | 6 +- .../adapters/alipay/components/CoverImage.ts | 4 +- .../adapters/alipay/components/CoverView.ts | 4 +- .../src/adapters/alipay/components/Form.ts | 4 +- .../src/adapters/alipay/components/Icon.ts | 4 +- .../src/adapters/alipay/components/Image.ts | 4 +- .../src/adapters/alipay/components/Input.ts | 4 +- .../src/adapters/alipay/components/Label.ts | 4 +- .../adapters/alipay/components/Lifestyle.ts | 4 +- .../src/adapters/alipay/components/Map.ts | 4 +- .../adapters/alipay/components/MovableArea.ts | 4 +- .../adapters/alipay/components/MovableView.ts | 4 +- .../adapters/alipay/components/Navigator.ts | 4 +- .../src/adapters/alipay/components/Picker.ts | 4 +- .../adapters/alipay/components/PickerView.ts | 4 +- .../alipay/components/PickerViewColumn.ts | 4 +- .../adapters/alipay/components/Progress.ts | 4 +- .../src/adapters/alipay/components/Radio.ts | 4 +- .../adapters/alipay/components/RadioGroup.ts | 4 +- .../adapters/alipay/components/RichText.ts | 4 +- .../adapters/alipay/components/ScrollView.ts | 4 +- .../src/adapters/alipay/components/Slider.ts | 4 +- .../src/adapters/alipay/components/Swiper.ts | 4 +- .../adapters/alipay/components/SwiperItem.ts | 4 +- .../src/adapters/alipay/components/Switch.ts | 4 +- .../src/adapters/alipay/components/Text.ts | 4 +- .../adapters/alipay/components/TextArea.ts | 4 +- .../src/adapters/alipay/components/View.ts | 4 +- .../src/adapters/alipay/components/WebView.ts | 4 +- .../src/adapters/alipay/components/factory.ts | 16 - packages/remax/src/adapters/alipay/index.ts | 1 + .../src/adapters/toutiao/components/Button.ts | 7 +- .../src/adapters/toutiao/components/Canvas.ts | 7 +- .../adapters/toutiao/components/Checkbox.ts | 7 +- .../toutiao/components/CheckboxGroup.ts | 7 +- .../src/adapters/toutiao/components/Form.ts | 7 +- .../src/adapters/toutiao/components/Icon.ts | 8 +- .../src/adapters/toutiao/components/Image.ts | 7 +- .../src/adapters/toutiao/components/Input.ts | 7 +- .../src/adapters/toutiao/components/Label.ts | 7 +- .../adapters/toutiao/components/Navigator.ts | 7 +- .../src/adapters/toutiao/components/Picker.ts | 9 +- .../adapters/toutiao/components/PickerView.ts | 7 +- .../toutiao/components/PickerViewColumn.ts | 4 +- .../adapters/toutiao/components/Progress.ts | 7 +- .../src/adapters/toutiao/components/Radio.ts | 7 +- .../adapters/toutiao/components/RadioGroup.ts | 7 +- .../adapters/toutiao/components/RichText.ts | 7 +- .../adapters/toutiao/components/ScrollView.ts | 7 +- .../src/adapters/toutiao/components/Slider.ts | 7 +- .../src/adapters/toutiao/components/Swiper.ts | 7 +- .../adapters/toutiao/components/SwiperItem.ts | 7 +- .../src/adapters/toutiao/components/Switch.ts | 7 +- .../src/adapters/toutiao/components/Text.ts | 7 +- .../adapters/toutiao/components/Textarea.ts | 7 +- .../src/adapters/toutiao/components/Video.ts | 7 +- .../src/adapters/toutiao/components/View.ts | 7 +- .../adapters/toutiao/components/WebView.ts | 7 +- .../adapters/toutiao/components/baseTyping.ts | 5 + .../adapters/toutiao/components/factory.ts | 22 - packages/remax/src/adapters/toutiao/index.ts | 1 + .../src/adapters/wechat/components/Ad.ts | 4 +- .../src/adapters/wechat/components/Audio.ts | 4 +- .../src/adapters/wechat/components/Button.ts | 4 +- .../src/adapters/wechat/components/Camera.ts | 4 +- .../src/adapters/wechat/components/Canvas.ts | 4 +- .../adapters/wechat/components/Checkbox.ts | 4 +- .../wechat/components/CheckboxGroup.ts | 4 +- .../adapters/wechat/components/CoverImage.ts | 4 +- .../adapters/wechat/components/CoverView.ts | 4 +- .../src/adapters/wechat/components/Editor.ts | 4 +- .../src/adapters/wechat/components/Form.ts | 4 +- .../components/FunctionalPageNavigator.ts | 8 +- .../src/adapters/wechat/components/Icon.ts | 4 +- .../src/adapters/wechat/components/Image.ts | 4 +- .../src/adapters/wechat/components/Input.tsx | 10 +- .../src/adapters/wechat/components/Label.ts | 4 +- .../adapters/wechat/components/LivePlayer.ts | 4 +- .../adapters/wechat/components/LivePusher.ts | 4 +- .../src/adapters/wechat/components/Map.ts | 4 +- .../adapters/wechat/components/MovableArea.ts | 4 +- .../adapters/wechat/components/MovableView.ts | 4 +- .../adapters/wechat/components/Navigator.ts | 4 +- .../wechat/components/OfficialAccount.ts | 6 +- .../adapters/wechat/components/OpenData.ts | 4 +- .../src/adapters/wechat/components/Picker.ts | 4 +- .../adapters/wechat/components/PickerView.ts | 4 +- .../wechat/components/PickerViewColumn.ts | 6 +- .../adapters/wechat/components/Progress.ts | 4 +- .../src/adapters/wechat/components/Radio.ts | 4 +- .../adapters/wechat/components/RadioGroup.ts | 4 +- .../adapters/wechat/components/RichText.ts | 4 +- .../adapters/wechat/components/ScrollView.ts | 4 +- .../src/adapters/wechat/components/Slider.ts | 4 +- .../src/adapters/wechat/components/Swiper.tsx | 10 +- .../adapters/wechat/components/SwiperItem.ts | 4 +- .../src/adapters/wechat/components/Switch.ts | 4 +- .../src/adapters/wechat/components/Text.ts | 4 +- .../adapters/wechat/components/Textarea.tsx | 10 +- .../src/adapters/wechat/components/Video.tsx | 10 +- .../src/adapters/wechat/components/View.ts | 4 +- .../src/adapters/wechat/components/WebView.ts | 4 +- .../src/adapters/wechat/components/factory.ts | 20 - packages/remax/src/adapters/wechat/index.ts | 1 + packages/remax/src/createHostComponent.ts | 29 ++ packages/remax/src/index.ts | 1 + packages/remax/src/propsAlias.ts | 21 - 208 files changed, 2702 insertions(+), 826 deletions(-) create mode 100644 packages/remax-cli/src/__tests__/fixtures/createHostComponent/expected/alipay/app.js create mode 100644 packages/remax-cli/src/__tests__/fixtures/createHostComponent/expected/alipay/app.json create mode 100644 packages/remax-cli/src/__tests__/fixtures/createHostComponent/expected/alipay/helper.sjs create mode 100644 packages/remax-cli/src/__tests__/fixtures/createHostComponent/expected/alipay/pages/index.axml create mode 100644 packages/remax-cli/src/__tests__/fixtures/createHostComponent/expected/alipay/pages/index.js create mode 100644 packages/remax-cli/src/__tests__/fixtures/createHostComponent/expected/alipay/pages/index.json create mode 100644 packages/remax-cli/src/__tests__/fixtures/createHostComponent/expected/toutiao/app.js create mode 100644 packages/remax-cli/src/__tests__/fixtures/createHostComponent/expected/toutiao/app.json create mode 100644 packages/remax-cli/src/__tests__/fixtures/createHostComponent/expected/toutiao/base.ttml create mode 100644 packages/remax-cli/src/__tests__/fixtures/createHostComponent/expected/toutiao/pages/index.js create mode 100644 packages/remax-cli/src/__tests__/fixtures/createHostComponent/expected/toutiao/pages/index.json create mode 100644 packages/remax-cli/src/__tests__/fixtures/createHostComponent/expected/toutiao/pages/index.ttml create mode 100644 packages/remax-cli/src/__tests__/fixtures/createHostComponent/expected/wechat/app.js create mode 100644 packages/remax-cli/src/__tests__/fixtures/createHostComponent/expected/wechat/app.json create mode 100644 packages/remax-cli/src/__tests__/fixtures/createHostComponent/expected/wechat/base.wxml create mode 100644 packages/remax-cli/src/__tests__/fixtures/createHostComponent/expected/wechat/helper.wxs create mode 100644 packages/remax-cli/src/__tests__/fixtures/createHostComponent/expected/wechat/pages/index.js create mode 100644 packages/remax-cli/src/__tests__/fixtures/createHostComponent/expected/wechat/pages/index.json create mode 100644 packages/remax-cli/src/__tests__/fixtures/createHostComponent/expected/wechat/pages/index.wxml create mode 100644 packages/remax-cli/src/__tests__/fixtures/createHostComponent/src/app.config.js create mode 100644 packages/remax-cli/src/__tests__/fixtures/createHostComponent/src/app.js create mode 100644 packages/remax-cli/src/__tests__/fixtures/createHostComponent/src/pages/index.js create mode 100644 packages/remax-cli/src/build/adapters/alipay/hostComponents/index.ts create mode 100644 packages/remax.macro/.npmignore create mode 100644 packages/remax.macro/README.md create mode 100644 packages/remax.macro/jest.config.js create mode 100644 packages/remax.macro/package.json create mode 100644 packages/remax.macro/src/createHostComponent.ts create mode 100644 packages/remax.macro/src/index.ts create mode 100644 packages/remax.macro/src/macro.ts create mode 100644 packages/remax.macro/tests/fixtures/createHostComponent/imported/code.js create mode 100644 packages/remax.macro/tests/fixtures/createHostComponent/imported/output.js create mode 100644 packages/remax.macro/tests/fixtures/createHostComponent/multiple/code.js create mode 100644 packages/remax.macro/tests/fixtures/createHostComponent/multiple/output.js create mode 100644 packages/remax.macro/tests/fixtures/createHostComponent/namedImported/code.js create mode 100644 packages/remax.macro/tests/fixtures/createHostComponent/namedImported/output.js create mode 100644 packages/remax.macro/tests/fixtures/createHostComponent/simple/code.js create mode 100644 packages/remax.macro/tests/fixtures/createHostComponent/simple/output.js create mode 100644 packages/remax.macro/tests/index.test.ts create mode 100644 packages/remax.macro/tsconfig.json create mode 100644 packages/remax.macro/typings/index.d.ts create mode 100644 packages/remax/macro.d.ts create mode 100644 packages/remax/macro.js create mode 100644 packages/remax/src/__tests__/__snapshots__/createRemaxComponent.test.tsx.snap create mode 100644 packages/remax/src/__tests__/createRemaxComponent.test.tsx delete mode 100644 packages/remax/src/adapters/alipay/components/factory.ts create mode 100644 packages/remax/src/adapters/toutiao/components/baseTyping.ts delete mode 100644 packages/remax/src/adapters/toutiao/components/factory.ts delete mode 100644 packages/remax/src/adapters/wechat/components/factory.ts create mode 100644 packages/remax/src/createHostComponent.ts diff --git a/.codesandbox/ci.json b/.codesandbox/ci.json index 4fc72599e..842784601 100644 --- a/.codesandbox/ci.json +++ b/.codesandbox/ci.json @@ -1,3 +1,8 @@ { - "packages": ["packages/remax", "packages/remax-cli"] + "packages": [ + "packages/remax", + "packages/remax-cli", + "packages/remax.macro", + "packages/babel-preset-remax" + ] } diff --git a/.prettierignore b/.prettierignore index aa5673b7d..f90b42a3f 100644 --- a/.prettierignore +++ b/.prettierignore @@ -1,3 +1,3 @@ lib node_modules -**/__tests__/**/expected +**/__tests__/**/expected \ No newline at end of file diff --git a/docs/guide/component.md b/docs/guide/component.md index d2a89ca2e..040edfaec 100644 --- a/docs/guide/component.md +++ b/docs/guide/component.md @@ -30,3 +30,46 @@ Remax ```html ``` + +## 注册基础组件 + +如果小程序添加了新的组件，而你所用的 Remax 版本还没提供该组件的支持，Remax 允许你自己创建一个新的基础组件。 + +假设微信小程序新增了一个 `` 组件，你可以这么做以让 Remax 提前支持： + +```jsx +import { createHostComponent } from 'remax/macro'; + +const FooBar = createHostComponent('foo-bar', ['foo']); + +function Page() { + return ; +} +``` + +如果你使用的是 TypeScript，还可以定义 `props` 类型： + +```jsx +import { createHostComponent } from 'remax/macro'; + +const FooBar = createHostComponent<{ foo: string; }>('foo-bar', ['foo]); + +function Page() { + return ; +} +``` + +> 组件名称和组件属性不能是动态变量，以下写法是错误的。 + +```jsx +import { createHostComponent } from 'remax/macro'; + +const componentName = 'foo-bar'; +const props = ['foo']; +// 必须直接写明组件名称和组件属性，不可用动态写法或变量传递的形式。 +const FooBar = createHostComponent(componentName, props); + +function Page() { + return ; +} +``` diff --git a/lint-staged.config.js b/lint-staged.config.js index 34f176fe3..c47c899a6 100644 --- a/lint-staged.config.js +++ b/lint-staged.config.js @@ -3,7 +3,10 @@ const micromatch = require('micromatch'); module.exports = { '*.{ts,tsx}': ['eslint --fix', 'prettier --write', 'git add'], '*.{md,js,jsx}': files => { - const match = micromatch.not(files, '**/__tests__/**/expected/**/*.js'); + const match = micromatch.not(files, [ + '**/__tests__/**/expected/**/*.js', + '**/tests/fixtures/**/output.js', + ]); return match.length > 1 ? [`prettier ${match.join(' ')} --write`, `git add ${match.join(' ')}`] : []; diff --git a/package.json b/package.json index 5823ea441..4479c4cc6 100644 --- a/package.json +++ b/package.json @@ -4,7 +4,7 @@ "version": "1.0.0", "scripts": { "watch": "lerna run watch --parallel", - "prebuild": "lerna run build --scope remax", + "prebuild": "lerna run build --scope remax --scope remax.macro", "build": "lerna run build --ignore website", "test": "lerna run --scope remax --scope remax-cli --stream test", "test:cov": "lerna run --scope remax --scope remax-cli --stream test -- --collect-coverage", diff --git a/packages/babel-preset-remax/package.json b/packages/babel-preset-remax/package.json index 0c11e1286..9b2f8bf53 100644 --- a/packages/babel-preset-remax/package.json +++ b/packages/babel-preset-remax/package.json @@ -26,7 +26,8 @@ "@babel/plugin-syntax-jsx": "^7.2.0", "@babel/preset-env": "^7.6.0", "@babel/preset-react": "^7.0.0", - "@babel/preset-typescript": "^7.6.0" + "@babel/preset-typescript": "^7.6.0", + "babel-plugin-macros": "^2.6.2" }, "devDependencies": { "@babel/core": "^7.6.0", diff --git a/packages/babel-preset-remax/src/index.ts b/packages/babel-preset-remax/src/index.ts index b8afc1a4a..ad2902bb9 100644 --- a/packages/babel-preset-remax/src/index.ts +++ b/packages/babel-preset-remax/src/index.ts @@ -22,6 +22,7 @@ function preset(api: any, presetOption: PresetOption) { return { presets, plugins: [ + require('babel-plugin-macros'), require('@babel/plugin-proposal-class-properties'), require('@babel/plugin-proposal-object-rest-spread'), require('@babel/plugin-syntax-jsx'), diff --git a/packages/remax-cli/src/__tests__/build.test.ts b/packages/remax-cli/src/__tests__/build.test.ts index bf9a4b7af..3ed7d6548 100644 --- a/packages/remax-cli/src/__tests__/build.test.ts +++ b/packages/remax-cli/src/__tests__/build.test.ts @@ -22,6 +22,22 @@ describe('build', () => { path.resolve(__dirname, `./fixtures/universe/expected/toutiao`) ); + runTest( + 'createHostComponent', + 'alipay', + path.resolve(__dirname, `./fixtures/createHostComponent/expected/alipay`) + ); + runTest( + 'createHostComponent', + 'wechat', + path.resolve(__dirname, `./fixtures/createHostComponent/expected/wechat`) + ); + runTest( + 'createHostComponent', + 'toutiao', + path.resolve(__dirname, `./fixtures/createHostComponent/expected/toutiao`) + ); + runTest('customRootDir'); runTest('disablePxToRpx'); runTest('babelrc'); diff --git a/packages/remax-cli/src/__tests__/fixtures/alipay/expected/pages/index.axml b/packages/remax-cli/src/__tests__/fixtures/alipay/expected/pages/index.axml index bf3bef977..2e3930eff 100644 --- a/packages/remax-cli/src/__tests__/fixtures/alipay/expected/pages/index.axml +++ b/packages/remax-cli/src/__tests__/fixtures/alipay/expected/pages/index.axml @@ -17,7 +17,6 @@ - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - -