关于 alias 配置的疑问

[Brucia323]

这是能够编译的配置：

    alias: {
      '@/components': path.resolve(__dirname, '..', 'src/components'),
      '@/*': path.resolve(__dirname, '..', 'src/*'),
    }

从理论上说，@/* 能够匹配 @/components，但实际不行。请大佬能为我解惑。
项目中使用了：

  usingComponents: {
    'ec-canvas': '@/components/ec-canvas/ec-canvas',
  }

以下是我的分析：

  /**
   * 读取页面及其依赖的组件的配置
   */
  getPagesConfig () {
    this.pages.forEach(page => {
      if (!this.isWatch && this.options.logger?.quiet === false) {
        printLog(processTypeEnum.COMPILE, '发现页面', this.getShowPath(page.path))
      }

      const pagePath = page.path
      const independentPackage = this.getIndependentPackage(pagePath)

      this.compileFile(page, independentPackage)
    })
  }

调用

  /**
   * 读取页面、组件的配置，并递归读取依赖的组件的配置
   */
  compileFile (file: IComponent, independentPackage?: IndependentPackage) {
    const filePath = file.path
    const fileConfigPath = file.isNative ? this.replaceExt(filePath, '.json') : this.getConfigFilePath(filePath)
    const fileConfig = readConfig(fileConfigPath, this.options.combination.config)
    const { componentGenerics, usingComponents } = fileConfig

    if (this.options.isBuildPlugin && componentGenerics) {
      Object.keys(componentGenerics).forEach(component => {
        if (componentGenerics[component]) {
          if (!componentConfig.thirdPartyComponents.has(component)) {
            componentConfig.thirdPartyComponents.set(component, new Set())
          }
        }
      })
    }

    // 递归收集依赖的第三方组件
    if (usingComponents) {
      const componentNames = Object.keys(usingComponents)
      const depComponents: Array<{ name: string, path: string }> = []
      // alias 的值需要从最终的 chain 中拿，避免用户在 webpackChain 中设置的 alias 无法被读取到
      const alias = this.options.combination.chain.toConfig().resolve?.alias

      for (const compName of componentNames) {
        let compPath: string = usingComponents[compName]

        if (isAliasPath(compPath, alias)) {
          compPath = replaceAliasPath(filePath, compPath, alias)
          fileConfig.usingComponents[compName] = compPath
        }

        // 判断是否为第三方依赖的正则，如果 test 为 false 则为第三方依赖
        const notNpmPkgReg = /^[.\\/]/
        if (
          !this.options.skipProcessUsingComponents &&
          !compPath.startsWith('plugin://') &&
          !notNpmPkgReg.test(compPath)
        ) {
          const tempCompPath = getNpmPackageAbsolutePath(compPath)

          if (tempCompPath) {
            compPath = tempCompPath
            fileConfig.usingComponents[compName] = compPath
          }
        }

        depComponents.push({
          name: compName,
          path: compPath
        })

        if (!componentConfig.thirdPartyComponents.has(compName) && !file.isNative) {
          componentConfig.thirdPartyComponents.set(compName, new Set())
        }
      }

      depComponents.forEach(item => {
        const componentPath = resolveMainFilePath(path.resolve(path.dirname(file.path), item.path))
        if (fs.existsSync(componentPath) && !Array.from(this.components).some(item => item.path === componentPath)) {
          const componentName = this.getComponentName(componentPath)
          // newBlended 模式下，本地化组件使用Page进行处理，此处直接跳过
          if (this.nativeComponents.has(componentName)) return
          const componentTempPath = this.getTemplatePath(componentPath)
          const isNative = this.isNativePageORComponent(componentTempPath)
          const componentObj = {
            name: componentName,
            path: componentPath,
            isNative,
            stylePath: isNative ? this.getStylePath(componentPath) : undefined,
            templatePath: isNative ? this.getTemplatePath(componentPath) : undefined
          }

          // 收集独立分包的组件，用于后续单独编译
          independentPackage?.components?.push(componentPath)

          this.components.add(componentObj)
          this.compileFile(componentObj, independentPackage)
        }
      })
    }

    this.filesConfig[this.getConfigFilePath(file.name)] = {
      content: fileConfig,
      path: fileConfigPath
    }
  }

在收集处理第三方依赖的过程中，调用

export function replaceAliasPath(filePath: string, name: string, pathAlias: Record<string, any> = {}) {
  // 后续的 path.join 在遇到符号链接时将会解析为真实路径，如果
  // 这里的 filePath 没有做同样的处理，可能会导致 import 指向
  // 源代码文件，导致文件被意外修改
  filePath = fs.realpathSync(filePath)

  const prefixes = Object.keys(pathAlias)
  if (prefixes.includes(name)) { // false
    return promoteRelativePath(path.relative(filePath, fs.realpathSync(resolveScriptPath(pathAlias[name]))))
  }
  const reg = new RegExp(`^(${prefixes.join('|')})/(.*)`)
  name = name.replace(reg, function (_m, $1, $2) {
    return promoteRelativePath(path.relative(filePath, path.join(pathAlias[$1], $2)))
  })
  return name
}

在 replace() 时没有匹配到，导致 path.join() 的参数存在 undefined。