mpx转化快手小程序

.eslintrc.js

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

packages/api-proxy/src/common/js/utils.js

@@ -46,7 +46,7 @@ const handleSuccess = (opts, getOptions = noop, thisObj) => {
 
 function genFromMap () {
   const result = {}
-  const platforms = ['wx', 'ali', 'swan', 'qq', 'tt', 'web', 'qa', 'jd', 'dd']
+  const platforms = ['wx', 'ali', 'swan', 'qq', 'tt', 'web', 'qa', 'jd', 'dd', 'ks']
   platforms.forEach((platform) => {
     result[`__mpx_src_mode_${platform}__`] = platform
   })
@@ -71,6 +71,8 @@ function getEnvObj () {
       return qa
     case 'dd':
       return dd
+    case 'ks':
+      return ks
   }
 }
 

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'
+declare let __mpx_mode__: 'wx' | 'ali' | 'swan' | 'qq' | 'tt' | 'web' | 'dd' | 'qa' | 'jd' | 'ks'
 
 // declaration for mpx env
 declare let __mpx_env__: string

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

@@ -314,7 +314,7 @@ interface MpxConfig {
   webRouteConfig: object
 }
 
-type SupportedMode = 'wx' | 'ali' | 'qq' | 'swan' | 'tt' | 'web' | 'qa'
+type SupportedMode = 'wx' | 'ali' | 'qq' | 'swan' | 'tt' | 'web' | 'qa' | 'ks'
 
 interface ImplementOptions {
   modes?: Array<SupportedMode>

packages/core/src/convertor/convertor.js

@@ -11,6 +11,7 @@ import wxToQqRule from './wxToQq'
 import wxToTtRule from './wxToTt'
 import wxToDdRule from './wxToDd'
 import wxToJdRule from './wxToJd'
+import wxToKsRule from './wxToKs'
 
 // 根据当前环境获取的默认生命周期信息
 let lifecycleInfo
@@ -55,7 +56,8 @@ const rulesMap = {
   wxToQq: { ...defaultConvertRule, ...wxToQqRule },
   wxToTt: { ...defaultConvertRule, ...wxToTtRule },
   wxToDd: { ...defaultConvertRule, ...wxToDdRule },
-  wxToJd: { ...defaultConvertRule, ...wxToJdRule }
+  wxToJd: { ...defaultConvertRule, ...wxToJdRule },
+  wxToKs: { ...defaultConvertRule, ...wxToKsRule }
 }
 
 export function getConvertRule (convertMode) {

packages/core/src/convertor/getConvertMode.js

@@ -5,7 +5,8 @@ const convertModes = {
   'wx-qq': 'wxToQq',
   'wx-tt': 'wxToTt',
   'wx-jd': 'wxToJd',
-  'wx-dd': 'wxToDd'
+  'wx-dd': 'wxToDd',
+  'wx-ks':'wxToKs'
 }
 
 export function getConvertMode (srcMode) {

packages/core/src/convertor/wxToKs.js

@@ -0,0 +1,18 @@
+const BEHAVIORS_MAP = {
+  'wx://form-field': 'ks://form-field',
+  'wx://form-field-group': 'ks://form-field-group',
+  'wx://form-field-button': 'ks://form-field-button',
+  'wx://component-export': 'ks://component-export'
+}
+
+export default {
+  convert (options) {
+    if (options.behaviors) {
+      options.behaviors.forEach((behavior, idx) => {
+        if (typeof behavior === 'string' && BEHAVIORS_MAP[behavior]) {
+          options.behaviors.splice(idx, 1, BEHAVIORS_MAP[behavior])
+        }
+      })
+    }
+  }
+} 

packages/core/src/helper/env.js

@@ -16,5 +16,7 @@ export function getEnvObj () {
       return qa
     case 'dd':
       return dd
+    case 'ks':
+      return ks
   }
 }

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

@@ -3,7 +3,7 @@ import { isObject } from '../../helper/utils'
 export default function renderHelperMixin () {
   return {
     methods: {
-      _i (val, handler) {
+      i (val, handler) {
         let i, l, keys, key
         if (Array.isArray(val) || typeof val === 'string') {
           for (i = 0, l = val.length; i < l; i++) {
@@ -21,11 +21,11 @@ export default function renderHelperMixin () {
           }
         }
       },
-      _c (key, value) {
+      c (key, value) {
         this.__mpxProxy.renderData[key] = value
         return value
       },
-      _r () {
+      r () {
         this.__mpxProxy.renderWithData()
       }
     }

packages/webpack-plugin/lib/config.js

@@ -556,5 +556,63 @@ module.exports = {
       ref: 'dd:ref',
       show: 'dd:show'
     }
+  },
+  ks:{
+    typeExtMap: {
+      json: '.json',
+      script: '.js',
+      template: '.ksml',
+      styles: '.css'
+    },
+    tabBar: {
+      itemKey: 'list',
+      iconKey: 'iconPath',
+      activeIconKey: 'selectedIconPath'
+    },
+    event: {
+      parseEvent (attr) {
+        let match = /^(bind|catch|capture-bind|capture-catch):?(.*?)(?:\.(.*))?$/.exec(attr)
+        if (match) {
+          return {
+            prefix: match[1],
+            eventName: match[2],
+            modifier: match[3]
+          }
+        }
+      },
+      getEvent (eventName, prefix = 'bind') {
+        return prefix + eventName
+      },
+      defaultModelProp: 'value',
+      defaultModelEvent: 'input',
+      defaultModelValuePath: 'value',
+      shallowStringify (obj) {
+        let arr = []
+        for (let key in obj) {
+          let value = obj[key]
+          if (Array.isArray(value)) {
+            value = `[${value.join(',')}]`
+          }
+          arr.push(`${key}:${value}`)
+        }
+        return ` {${arr.join(',')}} `
+      }
+    },
+    wxs: {},
+    directive: {
+      if: 'ks:if',
+      elseif: 'ks:elif',
+      else: 'ks:else',
+      for: 'ks:for',
+      dynamicClass: 'class',
+      dynamicStyle: 'style',
+      ref: 'ks:ref',
+      show: 'ks:show',
+      model: 'ks:model',
+      modelProp: 'ks:model-prop',
+      modelEvent: 'ks:model-event',
+      modelValuePath: 'ks:model-value-path',
+      modelFilter: 'ks:model-filter'
+    }
   }
 }

packages/webpack-plugin/lib/file-loader.js

@@ -31,7 +31,7 @@ module.exports = function loader (content, prevOptions) {
     this._module.addPresentationalDependency(new RecordResourceMapDependency(resourcePath, 'staticResource', outputPath, packageRoot))
   }
 
-  let publicPath = `__webpack_public_path__ + ${JSON.stringify(url)}`
+  let publicPath = options.mode === 'ks'&& queryObj?.currentName ==='app' ? JSON.stringify(url) :`__webpack_public_path__ + ${JSON.stringify(url)}`
 
   if (options.publicPath) {
     if (typeof options.publicPath === 'function') {

packages/webpack-plugin/lib/loader.js

@@ -250,7 +250,7 @@ module.exports = function (content) {
       let ctor = 'App'
       if (ctorType === 'page') {
         // swan也默认使用Page构造器
-        if (mpx.forceUsePageCtor || mode === 'ali' || mode === 'swan') {
+        if (mpx.forceUsePageCtor || mode === 'ali' || mode === 'swan' || mode === 'ks') {
           ctor = 'Page'
         } else {
           ctor = 'Component'

packages/webpack-plugin/lib/platform/json/wx/index.js

@@ -39,7 +39,7 @@ module.exports = function getSpec ({ warn, error }) {
   }
 
   const spec = {
-    supportedModes: ['ali', 'swan', 'qq', 'tt', 'jd', 'qa', 'dd'],
+    supportedModes: ['ali', 'swan', 'qq', 'tt', 'jd', 'qa', 'dd', 'ks'],
     normalizeTest,
     page: [
       {

packages/webpack-plugin/lib/platform/template/wx/component-config/ad.js

@@ -8,6 +8,7 @@ module.exports = function ({ print }) {
   const qqValueWarningLog = print({ platform: 'qq', type: 'value', tag: TAG_NAME, isError: false })
   const qqPropLog = print({ platform: 'qq', tag: TAG_NAME, isError: false })
   const qqEventLog = print({ platform: 'qq', tag: TAG_NAME, isError: false, type: 'event' })
+  const ksPropLog = print({ platform: 'ks', tag: TAG_NAME, isError: false })
   return {
     test: TAG_NAME,
     props: [
@@ -33,6 +34,10 @@ module.exports = function ({ print }) {
             baiduValueWarningLog({ name: 'type', value: obj.value })
           }
           return obj
+        },
+        ks (obj) {
+          obj.name = 'type'
+          return obj
         }
       },
       {
@@ -42,7 +47,8 @@ module.exports = function ({ print }) {
       {
         test: /^(ad-intervals|ad-theme)$/,
         qq: qqPropLog,
-        swan: baiduPropLog
+        swan: baiduPropLog,
+        ks: ksPropLog
       }
     ],
     event: [

packages/webpack-plugin/lib/platform/template/wx/component-config/camera.js

@@ -13,6 +13,7 @@ module.exports = function ({ print }) {
   const qqEventLog = print({ platform: 'qq', tag: TAG_NAME, isError: false, type: 'event' })
   const qaPropLog = print({ platform: 'qa', tag: TAG_NAME, isError: false })
   const qaEventLog = print({ platform: 'qa', tag: TAG_NAME, isError: false, type: 'event' })
+  const ksPropLog = print({ platform: 'ks', tag: TAG_NAME, isError: false })
   return {
     test: TAG_NAME,
     props: [
@@ -46,7 +47,8 @@ module.exports = function ({ print }) {
       },
       {
         test: /^(resolution|frame-size)$/,
-        qq: qqPropLog
+        qq: qqPropLog,
+        ks: ksPropLog
       },
       {
         test: /^(frame-size|device-position)$/,

packages/webpack-plugin/lib/platform/template/wx/component-config/canvas.js

@@ -42,11 +42,27 @@ module.exports = function ({ print }) {
             'longtap': 'longTap'
           }
           return eventMap[eventName]
+        },
+        ks(eventName){
+          const eventMap = {
+            'touchstart': 'canvastouchstart',
+            'touchmove': 'canvastouchmove',
+            'touchend': 'canvastouchend',
+            'touchcancel': 'canvastouchcancel',
+            'longtap': 'canvaslongtap '
+          }
+          return eventMap[eventName]
         }
       },
       {
         test: /^(error)$/,
-        ali: aliEventLog
+        ali: aliEventLog, 
+        ks(eventName){
+          const eventMap = {
+            'error': 'canvaserror',
+          }
+          return eventMap[eventName]
+        }
       },
       {
         test: /^(longtap|error)$/,

packages/webpack-plugin/lib/platform/template/wx/component-config/cover-image.js

@@ -2,6 +2,7 @@ const TAG_NAME = 'cover-image'
 
 module.exports = function ({ print }) {
   const aliEventLog = print({ platform: 'ali', tag: TAG_NAME, isError: false, type: 'event' })
+  const ksPropLog = print({ platform: 'ks', tag: TAG_NAME, isError: false })
   return {
     test: TAG_NAME,
     web (tag, { el }) {
@@ -17,6 +18,10 @@ module.exports = function ({ print }) {
         web (prop, { el }) {
           el.isBuiltIn = true
         }
+      },
+      {
+        test:/^referrer-policy$/,
+        ks:ksPropLog
       }
     ],
     event: [

packages/webpack-plugin/lib/platform/template/wx/component-config/form.js

@@ -7,7 +7,7 @@ module.exports = function ({ print }) {
   const jdPropLog = print({ platform: 'jd', tag: TAG_NAME, isError: false })
   const webPropLog = print({ platform: 'web', tag: TAG_NAME, isError: false })
   const qaPropLog = print({ platform: 'qa', tag: TAG_NAME, isError: false })
-
+  const ksPropLog = print({ platform: 'ks', tag: TAG_NAME, isError: false })
   return {
     test: TAG_NAME,
     web (tag, { el }) {
@@ -26,7 +26,8 @@ module.exports = function ({ print }) {
       {
         test: /^(report-submit|report-submit-timeout)$/,
         web: webPropLog,
-        qa: qaPropLog
+        qa: qaPropLog,
+        ks: ksPropLog
       }
     ]
   }

packages/webpack-plugin/lib/platform/template/wx/component-config/input.js

@@ -13,7 +13,7 @@ module.exports = function ({ print }) {
   const webEventLog = print({ platform: 'web', tag: TAG_NAME, isError: false, type: 'event' })
   const webValueLog = print({ platform: 'web', tag: TAG_NAME, isError: false, type: 'value' })
   const qaPropLog = print({ platform: 'qa', tag: TAG_NAME, isError: false })
-
+  const ksPropLog = print({ platform: 'ks', tag: TAG_NAME, isError: false })
   return {
     test: TAG_NAME,
     web (tag, { el }) {
@@ -37,6 +37,10 @@ module.exports = function ({ print }) {
         test: /^(hold-keyboard)$/,
         jd: jdPropLog
       },
+      {
+        test: /^(placeholder-class|cursor-spacing|always-embed|cursor|selection-start|selection-end|safe-password-cert-path|safe-password-length|safe-password-time-stamp|safe-password-nonce|safe-password-salt|safe-password-custom-hash)$/,
+        ks: ksPropLog
+      },
       {
         test: 'type',
         web (prop) {

packages/webpack-plugin/lib/platform/template/wx/component-config/movable-view.js

@@ -3,6 +3,7 @@ const TAG_NAME = 'movable-view'
 module.exports = function ({ print }) {
   const aliEventLog = print({ platform: 'ali', tag: TAG_NAME, isError: false, type: 'event' })
   const qaPropLog = print({ platform: 'qa', tag: TAG_NAME, isError: false })
+  const ksEventLog = print({ platform: 'ks', tag: TAG_NAME, isError: false, type: 'event' })
   return {
     test: TAG_NAME,
     web (tag, { el }) {
@@ -18,7 +19,8 @@ module.exports = function ({ print }) {
     event: [
       {
         test: /^(htouchmove|vtouchmove)$/,
-        ali: aliEventLog
+        ali: aliEventLog,
+        ks: ksEventLog
       }
     ]
   }

packages/webpack-plugin/lib/platform/template/wx/component-config/progress.js

@@ -10,7 +10,7 @@ module.exports = function ({ print }) {
   const jdPropLog = print({ platform: 'jd', tag: TAG_NAME, isError: false })
   const jdEventLog = print({ platform: 'jd', tag: TAG_NAME, isError: false, type: 'event' })
   const qqPropLog = print({ platform: 'qq', tag: TAG_NAME, isError: false })
-
+  const ksEventLog = print({ platform: 'ks', tag: TAG_NAME, isError: false, type: 'event' })
   return {
     test: TAG_NAME,
     web (tag, { el }) {
@@ -43,6 +43,14 @@ module.exports = function ({ print }) {
           }
           obj.name = propsMap[obj.name]
           return obj
+        },
+        ks (obj) {
+          const propsMap = {
+            'activeColor': 'active-color',
+            'backgroundColor': 'background-color'
+          }
+          obj.name = propsMap[obj.name]
+          return obj
         }
       },
       {
@@ -64,7 +72,8 @@ module.exports = function ({ print }) {
         ali: aliEventLog,
         swan: baiduEventLog,
         tt: ttEventLog,
-        jd: jdEventLog
+        jd: jdEventLog,
+        ks: ksEventLog
       }
     ]
   }