编写 resolveId 钩子插件

resolveId 钩子用于自定义模块路径解析逻辑。

基本结构

export default function resolvePlugin() {
  return {
    name: 'resolve-plugin',
    resolveId(source, importer) {
      // source 是导入路径
      // importer 是导入者的路径

      // 返回解析后的路径
      return resolvedPath
    }
  }
}

路径重定向

export default function redirectPlugin() {
  return {
    name: 'redirect-plugin',
    resolveId(source, importer) {
      // 将 old-lib 重定向到 new-lib
      if (source === 'old-lib') {
        return this.resolve('new-lib', importer)
      }
      return null
    }
  }
}

自定义路径映射

export default function aliasPlugin(options) {
  const aliases = options.aliases || {}

  return {
    name: 'alias-plugin',
    resolveId(source, importer) {
      for (const [alias, target] of Object.entries(aliases)) {
        if (source.startsWith(alias)) {
          const newSource = source.replace(alias, target)
          return this.resolve(newSource, importer)
        }
      }
      return null
    }
  }
}

虚拟模块识别

export default function virtualResolvePlugin() {
  const virtualModuleId = 'virtual:env'

  return {
    name: 'virtual-resolve',
    resolveId(source) {
      // 识别虚拟模块
      if (source === virtualModuleId) {
        return virtualModuleId
      }
      return null
    }
  }
}

注意：resolveId 返回的 id 会传递给 load 钩子。

返回值说明

resolveId(source, importer) {
  // 返回 null 使用默认解析
  return null

  // 返回字符串作为解析结果
  return '/path/to/module.js'

  // 返回对象提供更多信息
  return {
    id: '/path/to/module.js',
    external: false  // 是否外部化
  }

  // 调用默认解析器
  return this.resolve(source, importer)
}

解析顺序

import 'my-lib'
  → resolveId 钩子执行
  → 返回解析路径
  → load 钩子加载内容
  → transform 钩子转换

与 vite 默认别名配合

export default function customAliasPlugin() {
  return {
    name: 'custom-alias',
    enforce: 'pre',  // 在 vite 默认别名之前
    resolveId(source) {
      if (source.startsWith('$')) {
        return source.replace('$', '@company/')
      }
      return null
    }
  }
}

要点总结

• resolveId 自定义模块路径解析
• 可实现路径重定向和别名
• 返回 null 使用默认解析
• enforce 控制解析顺序