Skip to content

[请指教] 我自定义 NaiveProResolver 一直无法正确自动引入 #764

@InfernalAzazel

Description

@InfernalAzazel

Online display

import { ComponentResolver } from 'unplugin-vue-components'
import * as path from 'node:path'

const componentMap: Record<string, string> = {
  // 例如:组件名称到路径的映射
  'ProQueryForm':  'packages/form/query.vue',
  // 添加更多的组件映射
};


export function NaiveProResolver(): ComponentResolver {
  return {
    type: 'component',
    resolve: (name: string) => {
      const componentPath = componentMap[name];
      console.log(name, componentPath)
      return { name: name, from: componentPath, sideEffects: undefined };
    },
  }
}
import { fileURLToPath, URL } from 'node:url'
import { defineConfig } from 'vite'
import vue from '@vitejs/plugin-vue'
import * as path from 'node:path'
import Components from 'unplugin-vue-components/vite';
import { NaiveUiResolver } from 'unplugin-vue-components/resolvers'
import NaiveProResolver from './packages/resolver'

// https://vitejs.dev/config/
export default defineConfig({
  css: {
    postcss: './postcss.config.js',
  },
  build: {
    // 库模式配置
    lib: {
      // 入口文件
      entry: path.resolve(__dirname, 'packages/index.ts'),
      // ESModule模式
      formats: ['es'],
      // 输出的文件名
      fileName: (format) => `naive-pro-components.${format}.ts`
    },
    rollupOptions: {
      // 外部化处理那些你不想打包进库的依赖
      external: ['vue', 'naive-ui'],
      output: {
        // 为外部化的依赖提供一个全局变量
        globals: {
          vue: 'Vue'
        }
      }
    }
  },
  plugins: [
    vue(),
    Components({
      // dirs: ['packages'],
      // extensions: ['vue'],
      // deep: true,
      // dts: true,
      resolvers: [
        // NaiveUiResolver(),
        NaiveProResolver()
      ],
    }),
  ],
  resolve: {
    alias: {
      '@': fileURLToPath(new URL('./packages', import.meta.url))
    }
  }
})
  • 错误信息
ProQueryForm packages/form/query.vue
NSpace undefined
18:02:50 [vite] Internal server error: Failed to resolve import "undefined" from "example/components/form/DemoProFormQuery.vue". Does the file exist?
  Plugin: vite:import-analysis
  File: /work/code/github/naive-pro-components/example/components/form/DemoProFormQuery.vue:1:90
  1  |  /* unplugin-vue-components disabled */import { NSpace as __unplugin_components_1 } from 'undefined';
     |                                                                                           ^
  2  |  import { ProQueryForm as __unplugin_components_0 } from 'packages/form/query.vue';
  3  |  import { defineComponent as _defineComponent } from "vue";
      at formatError (file:///work/code/github/naive-pro-components/node_modules/.pnpm/[email protected]_@[email protected]/node_modules/vite/dist/node/chunks/dep-cNe07EU9.js:50830:46)
      at TransformContext.error (file:///work/code/github/naive-pro-components/node_modules/.pnpm/[email protected]_@[email protected]/node_modules/vite/dist/node/chunks/dep-cNe07EU9.js:50824:19)
      at normalizeUrl (file:///work/code/github/naive-pro-components/node_modules/.pnpm/[email protected]_@[email protected]/node_modules/vite/dist/node/chunks/dep-cNe07EU9.js:66128:33)
      at process.processTicksAndRejections (node:internal/process/task_queues:95:5)
      at async file:///work/code/github/naive-pro-components/node_modules/.pnpm/[email protected]_@[email protected]/node_modules/vite/dist/node/chunks/dep-cNe07EU9.js:66283:47
      at async Promise.all (index 0)
      at async TransformContext.transform (file:///work/code/github/naive-pro-components/node_modules/.pnpm/[email protected]_@[email protected]/node_modules/vite/dist/node/chunks/dep-cNe07EU9.js:66204:13)
      at async Object.transform (file:///work/code/github/naive-pro-components/node_modules/.pnpm/[email protected]_@[email protected]/node_modules/vite/dist/node/chunks/dep-cNe07EU9.js:51139:30)
      at async loadAndTransform (file:///work/code/github/naive-pro-components/node_modules/.pnpm/[email protected]_@[email protected]/node_modules/vite/dist/node/chunks/dep-cNe07EU9.js:53894:29)
18:02:50 [vite] Pre-transform error: Failed to resolve import "undefined" from "example/components/form/DemoProFormQuery.vue". Does the file exist?
node:internal/validators:162
    throw new ERR_INVALID_ARG_TYPE(name, 'string', value);
          ^

TypeError [ERR_INVALID_ARG_TYPE]: The "path" argument must be of type string. Received undefined
    at validateString (node:internal/validators:162:11)
    at isAbsolute (node:path:1160:5)
    at stringifyComponentInfo (file:///work/code/github/naive-pro-components/node_modules/.pnpm/[email protected][email protected]/node_modules/unplugin-vue-components/dist/chunk-TSU3OFN5.js:182:19)
    at file:///work/code/github/naive-pro-components/node_modules/.pnpm/[email protected][email protected]/node_modules/unplugin-vue-components/dist/chunk-TSU3OFN5.js:188:30
    at Array.map (<anonymous>)
    at stringifyComponentsInfo (file:///work/code/github/naive-pro-components/node_modules/.pnpm/[email protected][email protected]/node_modules/unplugin-vue-components/dist/chunk-TSU3OFN5.js:188:16)
    at getDeclarationImports (file:///work/code/github/naive-pro-components/node_modules/.pnpm/[email protected][email protected]/node_modules/unplugin-vue-components/dist/chunk-TSU3OFN5.js:192:21)
    at getDeclaration (file:///work/code/github/naive-pro-components/node_modules/.pnpm/[email protected][email protected]/node_modules/unplugin-vue-components/dist/chunk-TSU3OFN5.js:213:19)
    at writeDeclaration (file:///work/code/github/naive-pro-components/node_modules/.pnpm/[email protected][email protected]/node_modules/unplugin-vue-components/dist/chunk-TSU3OFN5.js:250:16) {
  code: 'ERR_INVALID_ARG_TYPE'
}

Node.js v20.10.0
 ELIFECYCLE  Command failed with exit code 1.
  • 目录
    image

Metadata

Metadata

Assignees

No one assigned

    Labels

    No labels
    No labels

    Type

    No type

    Projects

    No projects

    Milestone

    No milestone

    Relationships

    None yet

    Development

    No branches or pull requests

    Issue actions