search

unplugin / unplugin-vue-components

📲 On-demand components auto importing for Vue
https://www.npmjs.com/package/unplugin-vue-components
MIT License
3.65k stars 341 forks source link

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

Closed InfernalAzazel closed 3 weeks ago

InfernalAzazel commented 4 weeks ago

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 };
    },
  }
}

// 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/nodemodules/.pnpm/vite@5.2.11@types+node@20.12.12/node_modules/vite/dist/node/chunks/dep-cNe07EU9.js:50830:46) at TransformContext.error (file:///work/code/github/naive-pro-components/nodemodules/.pnpm/vite@5.2.11@types+node@20.12.12/node_modules/vite/dist/node/chunks/dep-cNe07EU9.js:50824:19) at normalizeUrl (file:///work/code/github/naive-pro-components/nodemodules/.pnpm/vite@5.2.11@types+node@20.12.12/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/nodemodules/.pnpm/vite@5.2.11@types+node@20.12.12/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/nodemodules/.pnpm/vite@5.2.11@types+node@20.12.12/node_modules/vite/dist/node/chunks/dep-cNe07EU9.js:66204:13) at async Object.transform (file:///work/code/github/naive-pro-components/nodemodules/.pnpm/vite@5.2.11@types+node@20.12.12/node_modules/vite/dist/node/chunks/dep-cNe07EU9.js:51139:30) at async loadAndTransform (file:///work/code/github/naive-pro-components/nodemodules/.pnpm/vite@5.2.11@types+node@20.12.12/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/unplugin-vue-components@0.27.0_vue@3.4.27/node_modules/unplugin-vue-components/dist/chunk-TSU3OFN5.js:182:19) at file:///work/code/github/naive-pro-components/node_modules/.pnpm/unplugin-vue-components@0.27.0_vue@3.4.27/node_modules/unplugin-vue-components/dist/chunk-TSU3OFN5.js:188:30 at Array.map () at stringifyComponentsInfo (file:///work/code/github/naive-pro-components/node_modules/.pnpm/unplugin-vue-components@0.27.0_vue@3.4.27/node_modules/unplugin-vue-components/dist/chunk-TSU3OFN5.js:188:16) at getDeclarationImports (file:///work/code/github/naive-pro-components/node_modules/.pnpm/unplugin-vue-components@0.27.0_vue@3.4.27/node_modules/unplugin-vue-components/dist/chunk-TSU3OFN5.js:192:21) at getDeclaration (file:///work/code/github/naive-pro-components/node_modules/.pnpm/unplugin-vue-components@0.27.0_vue@3.4.27/node_modules/unplugin-vue-components/dist/chunk-TSU3OFN5.js:213:19) at writeDeclaration (file:///work/code/github/naive-pro-components/node_modules/.pnpm/unplugin-vue-components@0.27.0_vue@3.4.27/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](https://github.com/unplugin/unplugin-vue-components/assets/40333954/1e22c050-1b64-48b2-b8dd-00b47a1e80d4)
CN-Haoling commented 1 week ago

请问如何解决的