wip(mp): support node_modules component

packages/uni-cli-shared/src/mp/constants.ts

+export const COMPONENT_ON_LINK = 'onVI'
+export const COMPONENT_BIND_LINK = '__l'

packages/uni-cli-shared/src/mp/index.ts

@@ -2,4 +2,5 @@ export * from './nvue'
 export * from './event'
 export * from './style'
 export * from './template'
+export * from './constants'
 export { transformVueComponentImports } from './transformImports'

packages/uni-cli-shared/src/utils.ts

@@ -7,21 +7,22 @@ export { default as hash } from 'hash-sum'
 
 import { PAGE_EXTNAME, PAGE_EXTNAME_APP } from './constants'
 import { SFCTemplateCompileOptions } from '@vue/compiler-sfc'
-import { NodeTypes, ElementNode, Node } from '@vue/compiler-core'
+import {
+  NodeTypes,
+  ElementNode,
+  RootNode,
+  TemplateChildNode,
+} from '@vue/compiler-core'
 export const isWindows = os.platform() === 'win32'
 export function normalizePath(id: string): string {
   return isWindows ? id.replace(/\\/g, '/') : id
 }
 
 export function checkElementNodeTag(
-  node: Node | null | undefined,
+  node: RootNode | TemplateChildNode | null | undefined,
   tag: string
 ): node is ElementNode {
-  return (
-    !!node &&
-    node.type === NodeTypes.ELEMENT &&
-    (node as ElementNode).tag === tag
-  )
+  return !!node && node.type === NodeTypes.ELEMENT && node.tag === tag
 }
 
 export const resolveMainPathOnce = once((inputDir: string) => {

packages/uni-cli-shared/src/vue/transforms/transformComponent.ts

@@ -9,30 +9,35 @@ import {
   TemplateChildNode,
   TransformContext,
 } from '@vue/compiler-core'
+import { COMPONENT_BIND_LINK, COMPONENT_ON_LINK } from '../../mp/constants'
 
-export function addComponentBindLink(
-  node: RootNode | TemplateChildNode,
-  context: TransformContext
+export function createTransformComponentLink(
+  name: typeof COMPONENT_BIND_LINK | typeof COMPONENT_ON_LINK
 ) {
-  if (
-    node.type === NodeTypes.ELEMENT &&
-    node.tagType === ElementTypes.COMPONENT
+  return function transformComponentLink(
+    node: RootNode | TemplateChildNode,
+    context: TransformContext
   ) {
-    const { tag } = node
     if (
-      isComponentTag(tag) ||
-      isCoreComponent(tag) ||
-      context.isBuiltInComponent(tag)
+      node.type === NodeTypes.ELEMENT &&
+      node.tagType === ElementTypes.COMPONENT
     ) {
-      return
+      const { tag } = node
+      if (
+        isComponentTag(tag) ||
+        isCoreComponent(tag) ||
+        context.isBuiltInComponent(tag)
+      ) {
+        return
+      }
+      node.props.push({
+        type: NodeTypes.DIRECTIVE,
+        name: 'on',
+        modifiers: [],
+        loc: locStub,
+        arg: createSimpleExpression(name, true),
+        exp: createSimpleExpression('__l', true),
+      })
     }
-    node.props.push({
-      type: NodeTypes.DIRECTIVE,
-      name: 'on',
-      modifiers: [],
-      loc: locStub,
-      arg: createSimpleExpression('__l', true),
-      exp: createSimpleExpression('__l', true),
-    })
   }
 }

packages/uni-mp-baidu/dist/uni.compiler.js

@@ -148,7 +148,7 @@ const miniProgram = {
         array: true,
     },
     slot: {
-        fallback: false,
+        fallback: true,
     },
     directive: 's-',
 };

packages/uni-mp-baidu/src/compiler/options.ts

@@ -12,7 +12,7 @@ export const miniProgram: MiniProgramCompilerOptions = {
     array: true,
   },
   slot: {
-    fallback: false,
+    fallback: true,
   },
   directive: 's-',
 }

packages/uni-mp-compiler/__tests__/component.spec.ts

-import { addComponentBindLink } from '@dcloudio/uni-cli-shared'
+import {
+  COMPONENT_BIND_LINK,
+  createTransformComponentLink,
+} from '@dcloudio/uni-cli-shared'
 import { assert } from './testUtils'
 
+const nodeTransforms = [createTransformComponentLink(COMPONENT_BIND_LINK)]
 describe('compiler: transform component', () => {
-  //   test('basic', () => {
-  //     assert(
-  //       `<custom/>`,
-  //       `<custom v-i="2a9ec0b0-0" bind:__l="__l"/>`,
-  //       `(_ctx, _cache) => {
-  //   return {}
-  // }`,
-  //       {
-  //         nodeTransforms: [addComponentBindLink as any],
-  //       }
-  //     )
-  //   })
   test('component + component', () => {
     assert(
       `<custom><custom1/></custom>`,
@@ -22,7 +14,7 @@ describe('compiler: transform component', () => {
   return {}
 }`,
       {
-        nodeTransforms: [addComponentBindLink as any],
+        nodeTransforms,
       }
     )
   })
@@ -34,7 +26,7 @@ describe('compiler: transform component', () => {
   return {}
 }`,
       {
-        nodeTransforms: [addComponentBindLink as any],
+        nodeTransforms,
       }
     )
   })
@@ -46,7 +38,7 @@ describe('compiler: transform component', () => {
   return { a: _f(_ctx.items, (item, k0, i0) => { return { a: '2a9ec0b0-0' + '-' + i0 }; }) }
 }`,
       {
-        nodeTransforms: [addComponentBindLink as any],
+        nodeTransforms,
       }
     )
     assert(
@@ -56,7 +48,7 @@ describe('compiler: transform component', () => {
   return { a: _f(_ctx.items, (item, key, index) => { return { a: '2a9ec0b0-0' + '-' + index }; }) }
 }`,
       {
-        nodeTransforms: [addComponentBindLink as any],
+        nodeTransforms,
       }
     )
   })
@@ -68,7 +60,7 @@ describe('compiler: transform component', () => {
   return { a: _f(_ctx.items, (item, k0, i0) => { return { a: '2a9ec0b0-1' + '-' + i0 + ',' + '2a9ec0b0-0' }; }) }
 }`,
       {
-        nodeTransforms: [addComponentBindLink as any],
+        nodeTransforms,
       }
     )
   })
@@ -80,7 +72,7 @@ describe('compiler: transform component', () => {
   return { a: _f(_ctx.items, (item, k0, i0) => { return { a: '2a9ec0b0-1' + '-' + i0 + ',' + ('2a9ec0b0-0' + '-' + i0), b: '2a9ec0b0-0' + '-' + i0 }; }) }
 }`,
       {
-        nodeTransforms: [addComponentBindLink as any],
+        nodeTransforms,
       }
     )
   })
@@ -92,7 +84,7 @@ describe('compiler: transform component', () => {
   return { a: _f(_ctx.items, (item, k0, i0) => { return { a: _f(item.items, (item1, k1, i1) => { return { a: '2a9ec0b0-1' + '-' + i0 + '-' + i1 + ',' + ('2a9ec0b0-0' + '-' + i0) }; }), b: '2a9ec0b0-0' + '-' + i0 }; }) }
 }`,
       {
-        nodeTransforms: [addComponentBindLink as any],
+        nodeTransforms,
       }
     )
   })

packages/uni-mp-compiler/__tests__/slot.fallback.spec.ts

+import { assert, miniProgram } from './testUtils'
+
+const options = {
+  miniProgram: {
+    ...miniProgram,
+    slot: {
+      fallback: true,
+    },
+  },
+}
+describe('compiler: transform slot', () => {
+  test('basic', () => {
+    assert(
+      `<button><slot/></button>`,
+      `<button><slot/></button>`,
+      `(_ctx, _cache) => {
+  return {}
+}`,
+      options
+    )
+  })
+  test('fallback content', () => {
+    assert(
+      `<button><slot>Submit</slot></button>`,
+      `<button><slot>Submit</slot></button>`,
+      `(_ctx, _cache) => {
+  return {}
+}`,
+      options
+    )
+  })
+  test('names slots', () => {
+    assert(
+      `<button><slot name="text"/></button>`,
+      `<button><slot name="text"/></button>`,
+      `(_ctx, _cache) => {
+  return {}
+}`,
+      options
+    )
+  })
+  test('names slots with fallback content', () => {
+    assert(
+      `<button><slot name="text">Submit</slot></button>`,
+      `<button><slot name="text">Submit</slot></button>`,
+      `(_ctx, _cache) => {
+  return {}
+}`,
+      options
+    )
+  })
+})

packages/uni-mp-compiler/src/template/codegen.ts

@@ -114,7 +114,8 @@ function genVFor(
 function genSlot(node: SlotOutletNode, context: TemplateCodegenContext) {
   // 移除掉所有非name属性，即移除作用域插槽的绑定指令
   node.props = node.props.filter((prop) => prop.name === 'name')
-  if (!node.children.length) {
+  if (!node.children.length || context.slot.fallback) {
+    // 无后备内容或支持后备内容
     return genElement(node, context)
   }
   const children = node.children.slice()

packages/uni-mp-qq/dist/uni.compiler.js

@@ -133,7 +133,7 @@ const options = {
         extname: '.qml',
         directive: 'qq:',
         compilerOptions: {
-            nodeTransforms: [uniCliShared.addComponentBindLink],
+            nodeTransforms: [uniCliShared.createTransformComponentLink(uniCliShared.COMPONENT_BIND_LINK)],
         },
     },
     style: {

packages/uni-mp-qq/src/compiler/options.ts

 import path from 'path'
 
-import { addComponentBindLink } from '@dcloudio/uni-cli-shared'
+import {
+  COMPONENT_BIND_LINK,
+  createTransformComponentLink,
+} from '@dcloudio/uni-cli-shared'
 import { UniMiniProgramPluginOptions } from '@dcloudio/uni-mp-vite'
 
 import source from './project.config.json'
@@ -56,7 +59,7 @@ export const options: UniMiniProgramPluginOptions = {
     extname: '.qml',
     directive: 'qq:',
     compilerOptions: {
-      nodeTransforms: [addComponentBindLink],
+      nodeTransforms: [createTransformComponentLink(COMPONENT_BIND_LINK)],
     },
   },
   style: {

packages/uni-mp-toutiao/dist/uni.compiler.js

@@ -69,12 +69,12 @@ ${filter.code}
             },
         },
         slot: {
-            fallback: false,
+            fallback: true,
         },
         extname: '.ttml',
         directive: 'tt:',
         compilerOptions: {
-            nodeTransforms: [uniCliShared.addComponentBindLink],
+            nodeTransforms: [uniCliShared.createTransformComponentLink(uniCliShared.COMPONENT_BIND_LINK)],
         },
     },
     style: {

packages/uni-mp-toutiao/src/compiler/options.ts

 import path from 'path'
-import { addComponentBindLink } from '@dcloudio/uni-cli-shared'
+import {
+  COMPONENT_BIND_LINK,
+  createTransformComponentLink,
+} from '@dcloudio/uni-cli-shared'
 import { UniMiniProgramPluginOptions } from '@dcloudio/uni-mp-vite'
 
 import source from './project.config.json'
@@ -44,12 +47,12 @@ ${filter.code}
       },
     },
     slot: {
-      fallback: false,
+      fallback: true,
     },
     extname: '.ttml',
     directive: 'tt:',
     compilerOptions: {
-      nodeTransforms: [addComponentBindLink],
+      nodeTransforms: [createTransformComponentLink(COMPONENT_BIND_LINK)],
     },
   },
   style: {

packages/uni-mp-vite/src/plugin/build.ts

@@ -11,6 +11,7 @@ import {
   hasJsonFile,
   removeExt,
   resolveMainPathOnce,
+  normalizeMiniProgramFilename,
 } from '@dcloudio/uni-cli-shared'
 import { GetManualChunk, GetModuleInfo } from 'rollup'
 import {
@@ -57,10 +58,7 @@ export function buildOptions(): UserConfig['build'] {
                 parseVirtualComponentPath(id)
               )
             }
-            const filepath = path.relative(inputDir, id)
-            return normalizePath(
-              filepath.replace(path.extname(filepath), '.js')
-            )
+            return removeExt(normalizeMiniProgramFilename(id, inputDir)) + '.js'
           }
           return '[name].js'
         },

packages/uni-mp-weixin/dist/uni.compiler.js

@@ -117,7 +117,10 @@ ${filter.code}
         extname: '.wxml',
         directive: 'wx:',
         compilerOptions: {
-            nodeTransforms: [uniCliShared.addComponentBindLink],
+            isCustomElement: (tag) => {
+                return ['page-meta', 'navigation-bar', 'match-media'].includes(tag);
+            },
+            nodeTransforms: [uniCliShared.createTransformComponentLink(uniCliShared.COMPONENT_BIND_LINK)],
         },
     },
     style: {

packages/uni-mp-weixin/src/compiler/options.ts

 import path from 'path'
 
-import { addComponentBindLink } from '@dcloudio/uni-cli-shared'
+import {
+  COMPONENT_BIND_LINK,
+  createTransformComponentLink,
+} from '@dcloudio/uni-cli-shared'
 import { UniMiniProgramPluginOptions } from '@dcloudio/uni-mp-vite'
 
 import source from './project.config.json'
@@ -65,7 +68,10 @@ ${filter.code}
     extname: '.wxml',
     directive: 'wx:',
     compilerOptions: {
-      nodeTransforms: [addComponentBindLink],
+      isCustomElement: (tag) => {
+        return ['page-meta', 'navigation-bar', 'match-media'].includes(tag)
+      },
+      nodeTransforms: [createTransformComponentLink(COMPONENT_BIND_LINK)],
     },
   },
   style: {