Merge pull request #2338 from didi/feat-convert-ks-v2

feat: 支持输出快手小程序

Author: hiyuki

.eslintrc.js

@@ -16,6 +16,7 @@ module.exports = {
     jd: 'readonly',
     qa: 'readonly',
     dd: 'readonly',
+    ks: 'readonly',
     Component: 'readonly',
     Page: 'readonly',
     App: 'readonly',

packages/core/@types/global.d.ts

@@ -1,5 +1,5 @@
 // declaration for mpx mode
-declare let __mpx_mode__: 'wx' | 'ali' | 'swan' | 'qq' | 'tt' | 'web' | 'dd' | 'qa' | 'jd' | 'android' | 'ios' | 'harmony'
+declare let __mpx_mode__: 'wx' | 'ali' | 'swan' | 'qq' | 'tt' | 'web' | 'dd' | 'qa' | 'jd' | 'android' | 'ios' | 'harmony' | 'ks'
 
 // declaration for mpx env
 declare let __mpx_env__: string

packages/core/@types/index.d.ts

@@ -412,7 +412,7 @@ interface MpxConfig {
   rnConfig: RnConfig,
 }
 
-type SupportedMode = 'wx' | 'ali' | 'qq' | 'swan' | 'tt' | 'web' | 'qa'
+type SupportedMode = 'wx' | 'ali' | 'qq' | 'swan' | 'tt' | 'web' | 'qa'| 'ks' | 'jd' | 'dd'
 
 interface ImplementOptions {
   modes?: Array<SupportedMode>

packages/core/src/convertor/convertor.js

@@ -9,6 +9,7 @@ import wxToTtRule from './wxToTt'
 import wxToDdRule from './wxToDd'
 import wxToJdRule from './wxToJd'
 import wxToReactRule from './wxToReact'
+import wxToKsRule from './wxToKs'
 
 /**
  * 转换规则包含四点
@@ -38,7 +39,8 @@ const rulesMap = {
   wxToJd: extend({}, defaultConvertRule, wxToJdRule),
   wxToIos: extend({}, defaultConvertRule, wxToReactRule),
   wxToAndroid: extend({}, defaultConvertRule, wxToReactRule),
-  wxToHarmony: extend({}, defaultConvertRule, wxToReactRule)
+  wxToHarmony: extend({}, defaultConvertRule, wxToReactRule),
+  wxToKs: extend({}, defaultConvertRule, wxToKsRule)
 }
 
 export function getConvertRule (convertMode) {

packages/core/src/convertor/getConvertMode.js

@@ -8,7 +8,8 @@ const convertModes = {
   'wx-dd': 'wxToDd',
   'wx-ios': 'wxToIos',
   'wx-android': 'wxToAndroid',
-  'wx-harmony': 'wxToHarmony'
+  'wx-harmony': 'wxToHarmony',
+  'wx-ks': 'wxToKs'
 }
 
 export function getConvertMode (srcMode) {

packages/core/src/convertor/wxToKs.js

@@ -0,0 +1,21 @@
+import { error } from '@mpxjs/utils'
+
+const BEHAVIORS_MAP = [
+  'wx://form-field',
+  'wx://form-field-group',
+  'wx://form-field-button',
+  'wx://component-export'
+]
+
+export default {
+  convert (options) {
+    if (options.behaviors) {
+      options.behaviors.forEach((behavior, idx) => {
+        if (BEHAVIORS_MAP.includes(behavior)) {
+          error(`Built-in behavior "${behavior}" is not supported in ks environment!`, global.currentResource || global.currentModuleId)
+          options.behaviors.splice(idx, 1)
+        }
+      })
+    }
+  }
+}

packages/core/src/core/proxy.js

@@ -31,8 +31,10 @@ import {
   wrapMethodsWithErrorHandling,
   warn,
   error,
-  getEnvObj
+  getEnvObj,
+  def
 } from '@mpxjs/utils'
+import { renderHelperDefs } from '../platform/builtInMixins/renderHelperMixin'
 import {
   BEFORECREATE,
   CREATED,
@@ -190,6 +192,7 @@ export default class MpxProxy {
     this.callHook(CREATED)
 
     if (!isWeb && !isReact) {
+      this.initRenderHelpers()
       this.initRender()
     }
 
@@ -728,6 +731,15 @@ export default class MpxProxy {
     this.toggleRecurse(true)
   }
 
+  initRenderHelpers () {
+    if (this.options.__nativeRender__ || __mpx_mode__ !== 'ks') return
+    Object.keys(renderHelperDefs).forEach((key) => {
+      if (!hasOwn(this.target, key)) {
+        def(this.target, key, renderHelperDefs[key])
+      }
+    })
+  }
+
   initRender () {
     if (this.options.__nativeRender__) return this.doRender()
 

packages/core/src/platform/builtInMixins/index.js

@@ -57,14 +57,18 @@ export default function getBuiltInMixins ({ type, rawOptions = {} }) {
     }
     // 此为纯增强类mixins，原生模式下不需要注入
     if (!rawOptions.__nativeRender__) {
-      bulitInMixins = bulitInMixins.concat([
-        renderHelperMixin(),
+      const enhancedMixins = [
         showMixin(type),
         i18nMixin(),
         dynamicRenderHelperMixin(),
         dynamicSlotMixin(),
         dynamicRefsMixin()
-      ])
+      ]
+      if (__mpx_mode__ !== 'ks') {
+        // ks methods 不支持 _ 或者 $ 开头的方法名，所以 ks 不走 methods mixin
+        enhancedMixins.unshift(renderHelperMixin())
+      }
+      bulitInMixins = bulitInMixins.concat(enhancedMixins)
     }
   }
   return bulitInMixins.filter(item => item)

packages/core/src/platform/builtInMixins/renderHelperMixin.js

@@ -1,44 +1,46 @@
 import { getByPath, hasOwn, isObject } from '@mpxjs/utils'
 
-export default function renderHelperMixin () {
-  return {
-    methods: {
-      _i (val, handler) {
-        let i, l, keys, key
-        if (Array.isArray(val) || typeof val === 'string') {
-          for (i = 0, l = val.length; i < l; i++) {
-            handler.call(this, val[i], i)
-          }
-        } else if (typeof val === 'number') {
-          for (i = 0; i < val; i++) {
-            handler.call(this, i + 1, i)
-          }
-        } else if (isObject(val)) {
-          keys = Object.keys(val)
-          for (i = 0, l = keys.length; i < l; i++) {
-            key = keys[i]
-            handler.call(this, val[key], key, i)
-          }
-        }
-      },
-      // collect
-      _c (key, value) {
-        if (hasOwn(this.__mpxProxy.renderData, key)) {
-          return this.__mpxProxy.renderData[key]
-        }
-        if (value === undefined) {
-          value = getByPath(this, key)
-        }
-        this.__mpxProxy.renderData[key] = value
-        return value
-      },
-      // simple collect
-      _sc (key) {
-        return (this.__mpxProxy.renderData[key] = this[key])
-      },
-      _r (skipPre, vnode) {
-        this.__mpxProxy.renderWithData(skipPre, vnode)
+export const renderHelperDefs = {
+  _i (val, handler) {
+    let i, l, keys, key
+    if (Array.isArray(val) || typeof val === 'string') {
+      for (i = 0, l = val.length; i < l; i++) {
+        handler.call(this, val[i], i)
+      }
+    } else if (typeof val === 'number') {
+      for (i = 0; i < val; i++) {
+        handler.call(this, i + 1, i)
       }
+    } else if (isObject(val)) {
+      keys = Object.keys(val)
+      for (i = 0, l = keys.length; i < l; i++) {
+        key = keys[i]
+        handler.call(this, val[key], key, i)
+      }
+    }
+  },
+  // collect
+  _c (key, value) {
+    if (hasOwn(this.__mpxProxy.renderData, key)) {
+      return this.__mpxProxy.renderData[key]
+    }
+    if (value === undefined) {
+      value = getByPath(this, key)
     }
+    this.__mpxProxy.renderData[key] = value
+    return value
+  },
+  // simple collect
+  _sc (key) {
+    return (this.__mpxProxy.renderData[key] = this[key])
+  },
+  _r (skipPre, vnode) {
+    this.__mpxProxy.renderWithData(skipPre, vnode)
+  }
+}
+
+export default function renderHelperMixin () {
+  return {
+    methods: renderHelperDefs
   }
 }

packages/utils/src/env.js

@@ -16,6 +16,8 @@ export function getEnvObj () {
       return qa
     case 'dd':
       return dd
+    case 'ks':
+      return ks
     default:
       return {}
   }