unjs / unimport Goto Github PK
View Code? Open in Web Editor NEWUnified utils for auto importing APIs in modules.
License: MIT License
Unified utils for auto importing APIs in modules.
License: MIT License
I am developing a web application in Nuxt. So, unjs/unimport has been very helpful. Thank you for developing it.
I often use the following two for developing web applications in Nuxt.
I would like to be able to use unjs stack from unimport presets, not only these two.
There are two possible designs
add unjs/*
to each preset.
presets/
harder to maintainpresets/consola.ts
presets/h3.ts
.presets: [
{
from: "consola",
imports: [ "consola" ]
},
{
from: "h3",
imports: [ "EventHandler", "EventHandlerRequest", "readBody", "getValidatedQuery" ]
}
]
create unjs presets.
This would be similar to the unjs/unkit philosophy.
presets/unjs.ts
to see what is available.presets/unjs.ts
.presets: [
{
from: "unjs",
imports: [ "consola", "EventHandler" ]
}
]
I would implement proposal 1 and move to proposal 2 if the number of unjs stacks required by users increases too much.
Environment: Stackblitz
👈️
Working directory: /home/projects/github-68jxaq 12:13:23 PM
Nuxt project info: 12:13:23 PM
------------------------------
- Operating System: Linux
- Node Version: v18.18.0
- Nuxt Version: 3.9.3
- CLI Version: 3.10.0
- Nitro Version: 2.8.1
- Package Manager: [email protected]
- Builder: -
- User Config: devtools, imports
- Runtime Modules: -
- Build Modules: -
------------------------------
https://stackblitz.com/edit/github-68jxaq?file=package.json,app.vue
I noticed in Nuxt that auto-import for TypeScript enums was not working, so I reported it to Nuxt #25311 but as @manniL mentioned in that issue, this is an upstream bug with unimport
itself so I am opening the issue here. I am not familiar with unimport
or how it works and I wasn't able to get an example up and running with it but I do have a Nuxt reproduction and I hope that helps.
Here is the issue - I have a TypeScript enum in common/types/user.ts
and I want to use this enum in my app. (see Stackblitz reproduction). And it gets auto-imported by Nuxt but it seems to do it wrongly. Because if I manually import it myself it works (typechecker does not complain). But if I let Nuxt auto-import do it then then typechecker is throwing this error:
$ npm run typecheck
> vue-tsc --noEmit
app.vue:9:23 - error TS2749: 'User' refers to a value, but is being used as a type here. Did you mean 'typeof User'?
9 const myFunc = (user: User) => {
~~~~
Found 1 error in app.vue:9
nuxt.config.ts:
export default defineNuxtConfig({
devtools: { enabled: true },
imports: {
dirs: [
'common/**/*.ts',
]
}
})
user.ts:
export enum User {
ADMIN = 'admin',
USER = 'user',
}
app.vue
<template>
<div>My app</div>
<button @click="myFunc(User.ADMIN)">My button</button>
</template>
<script setup lang="ts">
// import { User } from './common/types/user';
const myFunc = (user: User) => {
if (user === User.ADMIN) {
console.log('admin');
} else {
console.log('user');
}
console.log(user);
};
</script>
If I add the import manually then typechecker does not complain 🤷🏻♂️
import { User } from './common/types/user';
No response
No response
Stackblitz node cli project.
node: v18.18.0
https://stackblitz.com/edit/stackblitz-starters-hv4vuo
I am not sure if this issue is caused by tsup or unimport.
In a Node CLI project, if the entry file includes a shebang code like #!/usr/bin/env node
, then it must be explicitly declared for import, otherwise it will cause an error message like ✘ [ERROR] Syntax error "!
tsup.config.ts
import { defineConfig } from 'tsup';
import Unimport from 'unimport/unplugin';
export default defineConfig((options) => ({
entry: ['./src'],
format: ['esm'],
esbuildPlugins: [Unimport.esbuild({ dts: true, dirs: ['./src'] })],
}));
entry file: src/cli.ts
#!/usr/bin/env node
output();
No response
CLI Building entry: src/cli.ts, src/utils.ts
CLI Using tsconfig: tsconfig.json
CLI tsup v8.0.1
CLI Using tsup config: /home/projects/stackblitz-starters-hv4vuo/tsup.config.ts
CLI Target: esnext
ESM Build start
✘ [ERROR] Syntax error "!"
src/cli.ts:2:1:
2 │ #!/usr/bin/env node
╵ ^
ESM Build failed
Error: Build failed with 1 error:
src/cli.ts:2:1: ERROR: Syntax error "!"
at failureErrorWithLog (/home/projects/stackblitz-starters-hv4vuo/node_modules/.pnpm/[email protected]/node_modules/esbuild/lib/main.js:1641:15)
at eval (/home/projects/stackblitz-starters-hv4vuo/node_modules/.pnpm/[email protected]/node_modules/esbuild/lib/main.js:1049:25)
at runOnEndCallbacks (/home/projects/stackblitz-starters-hv4vuo/node_modules/.pnpm/[email protected]/node_modules/esbuild/lib/main.js:1476:45)
at buildResponseToResult (/home/projects/stackblitz-starters-hv4vuo/node_modules/.pnpm/[email protected]/node_modules/esbuild/lib/main.js:1047:7)
at eval (/home/projects/stackblitz-starters-hv4vuo/node_modules/.pnpm/[email protected]/node_modules/esbuild/lib/main.js:1076:16)
at responseCallbacks.<computed> (/home/projects/stackblitz-starters-hv4vuo/node_modules/.pnpm/[email protected]/node_modules/esbuild/lib/main.js:694:9)
at handleIncomingPacket (/home/projects/stackblitz-starters-hv4vuo/node_modules/.pnpm/[email protected]/node_modules/esbuild/lib/main.js:754:9)
at Socket.readFromStdout (/home/projects/stackblitz-starters-hv4vuo/node_modules/.pnpm/[email protected]/node_modules/esbuild/lib/main.js:670:7)
at EventEmitter.emit (node:events:42:9202)
at addChunk (node:internal/streams/readable:105:4109)
ELIFECYCLE Command failed with exit code 1.
RegExp is fast, but there would be so many edge cases that can't be solved properly. I think we could introduce an optional AST parsing mode to have the most accurate result, for ppl who willing to sacrifice a bit of performance to opt-in.
Hi Unimport team.
I'm a relatively new Nuxt 3 user, and one thing that always foxes me is auto-imports.
Although it's great that Nuxt auto-imports, the down-side is I don't know what is available, what or where it's from, or what package it belongs to. Sometimes I just look in the imports.d.ts
file just to see, but it's just a big list of names.
However, if the declarations were grouped by folder, I think it would be a nice hint for those of us looking behind the curtain.
I wrote a quick and dirty node script to see what it might look like, and I think it's super helpful already:
// Generated by auto imports
export {}
declare global {
// ../../node_modules/@unhead/vue
const injectHead: typeof import('../../node_modules/@unhead/vue')['injectHead']
const useHead: typeof import('../../node_modules/@unhead/vue')['useHead']
const useHeadSafe: typeof import('../../node_modules/@unhead/vue')['useHeadSafe']
const useSeoMeta: typeof import('../../node_modules/@unhead/vue')['useSeoMeta']
const useServerHead: typeof import('../../node_modules/@unhead/vue')['useServerHead']
const useServerHeadSafe: typeof import('../../node_modules/@unhead/vue')['useServerHeadSafe']
const useServerSeoMeta: typeof import('../../node_modules/@unhead/vue')['useServerSeoMeta']
// ../../node_modules/nuxt/dist/app
const abortNavigation: typeof import('../../node_modules/nuxt/dist/app')['abortNavigation']
const addRouteMiddleware: typeof import('../../node_modules/nuxt/dist/app')['addRouteMiddleware']
const cancelIdleCallback: typeof import('../../node_modules/nuxt/dist/app')['cancelIdleCallback']
const clearError: typeof import('../../node_modules/nuxt/dist/app')['clearError']
const clearNuxtData: typeof import('../../node_modules/nuxt/dist/app')['clearNuxtData']
const clearNuxtState: typeof import('../../node_modules/nuxt/dist/app')['clearNuxtState']
const createError: typeof import('../../node_modules/nuxt/dist/app')['createError']
const defineAppConfig: typeof import('../../node_modules/nuxt/dist/app')['defineAppConfig']
const defineNuxtComponent: typeof import('../../node_modules/nuxt/dist/app')['defineNuxtComponent']
const defineNuxtLink: typeof import('../../node_modules/nuxt/dist/app')['defineNuxtLink']
const defineNuxtPlugin: typeof import('../../node_modules/nuxt/dist/app')['defineNuxtPlugin']
const defineNuxtRouteMiddleware: typeof import('../../node_modules/nuxt/dist/app')['defineNuxtRouteMiddleware']
const definePayloadPlugin: typeof import('../../node_modules/nuxt/dist/app')['definePayloadPlugin']
const definePayloadReducer: typeof import('../../node_modules/nuxt/dist/app')['definePayloadReducer']
const definePayloadReviver: typeof import('../../node_modules/nuxt/dist/app')['definePayloadReviver']
const isNuxtError: typeof import('../../node_modules/nuxt/dist/app')['isNuxtError']
const isPrerendered: typeof import('../../node_modules/nuxt/dist/app')['isPrerendered']
const loadPayload: typeof import('../../node_modules/nuxt/dist/app')['loadPayload']
const navigateTo: typeof import('../../node_modules/nuxt/dist/app')['navigateTo']
const onNuxtReady: typeof import('../../node_modules/nuxt/dist/app')['onNuxtReady']
const prefetchComponents: typeof import('../../node_modules/nuxt/dist/app')['prefetchComponents']
const preloadComponents: typeof import('../../node_modules/nuxt/dist/app')['preloadComponents']
const preloadPayload: typeof import('../../node_modules/nuxt/dist/app')['preloadPayload']
const preloadRouteComponents: typeof import('../../node_modules/nuxt/dist/app')['preloadRouteComponents']
const refreshNuxtData: typeof import('../../node_modules/nuxt/dist/app')['refreshNuxtData']
const reloadNuxtApp: typeof import('../../node_modules/nuxt/dist/app')['reloadNuxtApp']
const requestIdleCallback: typeof import('../../node_modules/nuxt/dist/app')['requestIdleCallback']
const setPageLayout: typeof import('../../node_modules/nuxt/dist/app')['setPageLayout']
const setResponseStatus: typeof import('../../node_modules/nuxt/dist/app')['setResponseStatus']
const showError: typeof import('../../node_modules/nuxt/dist/app')['showError']
const updateAppConfig: typeof import('../../node_modules/nuxt/dist/app')['updateAppConfig']
const useAppConfig: typeof import('../../node_modules/nuxt/dist/app')['useAppConfig']
const useAsyncData: typeof import('../../node_modules/nuxt/dist/app')['useAsyncData']
const useCookie: typeof import('../../node_modules/nuxt/dist/app')['useCookie']
const useError: typeof import('../../node_modules/nuxt/dist/app')['useError']
const useFetch: typeof import('../../node_modules/nuxt/dist/app')['useFetch']
const useLazyAsyncData: typeof import('../../node_modules/nuxt/dist/app')['useLazyAsyncData']
const useLazyFetch: typeof import('../../node_modules/nuxt/dist/app')['useLazyFetch']
const useNuxtApp: typeof import('../../node_modules/nuxt/dist/app')['useNuxtApp']
const useNuxtData: typeof import('../../node_modules/nuxt/dist/app')['useNuxtData']
const useRequestEvent: typeof import('../../node_modules/nuxt/dist/app')['useRequestEvent']
const useRequestFetch: typeof import('../../node_modules/nuxt/dist/app')['useRequestFetch']
const useRequestHeaders: typeof import('../../node_modules/nuxt/dist/app')['useRequestHeaders']
const useRequestURL: typeof import('../../node_modules/nuxt/dist/app')['useRequestURL']
const useRoute: typeof import('../../node_modules/nuxt/dist/app')['useRoute']
const useRouter: typeof import('../../node_modules/nuxt/dist/app')['useRouter']
const useRuntimeConfig: typeof import('../../node_modules/nuxt/dist/app')['useRuntimeConfig']
const useState: typeof import('../../node_modules/nuxt/dist/app')['useState']
// ../../node_modules/nuxt/dist/app/compat/vue-demi
const isVue2: typeof import('../../node_modules/nuxt/dist/app/compat/vue-demi')['isVue2']
const isVue3: typeof import('../../node_modules/nuxt/dist/app/compat/vue-demi')['isVue3']
// ../../node_modules/nuxt/dist/pages/runtime/composables
const definePageMeta: typeof import('../../node_modules/nuxt/dist/pages/runtime/composables')['definePageMeta']
// ../../node_modules/vue
const computed: typeof import('../../node_modules/vue')['computed']
const customRef: typeof import('../../node_modules/vue')['customRef']
const defineAsyncComponent: typeof import('../../node_modules/vue')['defineAsyncComponent']
const defineComponent: typeof import('../../node_modules/vue')['defineComponent']
const defineModel: typeof import('../../node_modules/vue')['defineModel']
const defineOptions: typeof import('../../node_modules/vue')['defineOptions']
const defineSlots: typeof import('../../node_modules/vue')['defineSlots']
const effect: typeof import('../../node_modules/vue')['effect']
const effectScope: typeof import('../../node_modules/vue')['effectScope']
const getCurrentInstance: typeof import('../../node_modules/vue')['getCurrentInstance']
const getCurrentScope: typeof import('../../node_modules/vue')['getCurrentScope']
const h: typeof import('../../node_modules/vue')['h']
const hasInjectionContext: typeof import('../../node_modules/vue')['hasInjectionContext']
const inject: typeof import('../../node_modules/vue')['inject']
const isProxy: typeof import('../../node_modules/vue')['isProxy']
const isReactive: typeof import('../../node_modules/vue')['isReactive']
const isReadonly: typeof import('../../node_modules/vue')['isReadonly']
const isRef: typeof import('../../node_modules/vue')['isRef']
const isShallow: typeof import('../../node_modules/vue')['isShallow']
const markRaw: typeof import('../../node_modules/vue')['markRaw']
const mergeModels: typeof import('../../node_modules/vue')['mergeModels']
const nextTick: typeof import('../../node_modules/vue')['nextTick']
const onActivated: typeof import('../../node_modules/vue')['onActivated']
const onBeforeMount: typeof import('../../node_modules/vue')['onBeforeMount']
const onBeforeUnmount: typeof import('../../node_modules/vue')['onBeforeUnmount']
const onBeforeUpdate: typeof import('../../node_modules/vue')['onBeforeUpdate']
const onDeactivated: typeof import('../../node_modules/vue')['onDeactivated']
const onErrorCaptured: typeof import('../../node_modules/vue')['onErrorCaptured']
const onMounted: typeof import('../../node_modules/vue')['onMounted']
const onRenderTracked: typeof import('../../node_modules/vue')['onRenderTracked']
const onRenderTriggered: typeof import('../../node_modules/vue')['onRenderTriggered']
const onScopeDispose: typeof import('../../node_modules/vue')['onScopeDispose']
const onServerPrefetch: typeof import('../../node_modules/vue')['onServerPrefetch']
const onUnmounted: typeof import('../../node_modules/vue')['onUnmounted']
const onUpdated: typeof import('../../node_modules/vue')['onUpdated']
const provide: typeof import('../../node_modules/vue')['provide']
const proxyRefs: typeof import('../../node_modules/vue')['proxyRefs']
const reactive: typeof import('../../node_modules/vue')['reactive']
const readonly: typeof import('../../node_modules/vue')['readonly']
const ref: typeof import('../../node_modules/vue')['ref']
const resolveComponent: typeof import('../../node_modules/vue')['resolveComponent']
const shallowReactive: typeof import('../../node_modules/vue')['shallowReactive']
const shallowReadonly: typeof import('../../node_modules/vue')['shallowReadonly']
const shallowRef: typeof import('../../node_modules/vue')['shallowRef']
const toRaw: typeof import('../../node_modules/vue')['toRaw']
const toRef: typeof import('../../node_modules/vue')['toRef']
const toRefs: typeof import('../../node_modules/vue')['toRefs']
const toValue: typeof import('../../node_modules/vue')['toValue']
const triggerRef: typeof import('../../node_modules/vue')['triggerRef']
const unref: typeof import('../../node_modules/vue')['unref']
const useAttrs: typeof import('../../node_modules/vue')['useAttrs']
const useCssModule: typeof import('../../node_modules/vue')['useCssModule']
const useCssVars: typeof import('../../node_modules/vue')['useCssVars']
const useModel: typeof import('../../node_modules/vue')['useModel']
const useSlots: typeof import('../../node_modules/vue')['useSlots']
const useTransitionState: typeof import('../../node_modules/vue')['useTransitionState']
const watch: typeof import('../../node_modules/vue')['watch']
const watchEffect: typeof import('../../node_modules/vue')['watchEffect']
const watchPostEffect: typeof import('../../node_modules/vue')['watchPostEffect']
const watchSyncEffect: typeof import('../../node_modules/vue')['watchSyncEffect']
const withCtx: typeof import('../../node_modules/vue')['withCtx']
const withDirectives: typeof import('../../node_modules/vue')['withDirectives']
const withKeys: typeof import('../../node_modules/vue')['withKeys']
const withMemo: typeof import('../../node_modules/vue')['withMemo']
const withModifiers: typeof import('../../node_modules/vue')['withModifiers']
const withScopeId: typeof import('../../node_modules/vue')['withScopeId']
// ../../src/utils/config
const image: typeof import('../../src/utils/config')['image']
const link: typeof import('../../src/utils/config')['link']
const meta: typeof import('../../src/utils/config')['meta']
const script: typeof import('../../src/utils/config')['script']
// ../../src/utils/data
const isObject: typeof import('../../src/utils/data')['isObject']
// ../../src/utils/env
const isDev: typeof import('../../src/utils/env')['isDev']
const isProd: typeof import('../../src/utils/env')['isProd']
// ../../src/utils/text
const markdown: typeof import('../../src/utils/text')['markdown']
// ../vue-router
const onBeforeRouteLeave: typeof import('../vue-router')['onBeforeRouteLeave']
const onBeforeRouteUpdate: typeof import('../vue-router')['onBeforeRouteUpdate']
const useLink: typeof import('../vue-router')['useLink']
}
// for type re-export
declare global {
// @ts-ignore
export type { Component, ComponentPublicInstance, ComputedRef, ExtractPropTypes, ExtractPublicPropTypes, InjectionKey, PropType, Ref, MaybeRef, MaybeRefOrGetter, VNode } from '../../node_modules/vue'
}
// for vue template auto import
import { UnwrapRef } from 'vue'
declare module 'vue' {
interface ComponentCustomProperties {
// ../../node_modules/@unhead/vue
readonly injectHead: UnwrapRef<typeof import('../../node_modules/@unhead/vue')['injectHead']>
readonly useHead: UnwrapRef<typeof import('../../node_modules/@unhead/vue')['useHead']>
readonly useHeadSafe: UnwrapRef<typeof import('../../node_modules/@unhead/vue')['useHeadSafe']>
readonly useSeoMeta: UnwrapRef<typeof import('../../node_modules/@unhead/vue')['useSeoMeta']>
readonly useServerHead: UnwrapRef<typeof import('../../node_modules/@unhead/vue')['useServerHead']>
readonly useServerHeadSafe: UnwrapRef<typeof import('../../node_modules/@unhead/vue')['useServerHeadSafe']>
readonly useServerSeoMeta: UnwrapRef<typeof import('../../node_modules/@unhead/vue')['useServerSeoMeta']>
// ../../node_modules/nuxt/dist/app
readonly abortNavigation: UnwrapRef<typeof import('../../node_modules/nuxt/dist/app')['abortNavigation']>
readonly addRouteMiddleware: UnwrapRef<typeof import('../../node_modules/nuxt/dist/app')['addRouteMiddleware']>
readonly cancelIdleCallback: UnwrapRef<typeof import('../../node_modules/nuxt/dist/app')['cancelIdleCallback']>
readonly clearError: UnwrapRef<typeof import('../../node_modules/nuxt/dist/app')['clearError']>
readonly clearNuxtData: UnwrapRef<typeof import('../../node_modules/nuxt/dist/app')['clearNuxtData']>
readonly clearNuxtState: UnwrapRef<typeof import('../../node_modules/nuxt/dist/app')['clearNuxtState']>
readonly createError: UnwrapRef<typeof import('../../node_modules/nuxt/dist/app')['createError']>
readonly defineAppConfig: UnwrapRef<typeof import('../../node_modules/nuxt/dist/app')['defineAppConfig']>
readonly defineNuxtComponent: UnwrapRef<typeof import('../../node_modules/nuxt/dist/app')['defineNuxtComponent']>
readonly defineNuxtLink: UnwrapRef<typeof import('../../node_modules/nuxt/dist/app')['defineNuxtLink']>
readonly defineNuxtPlugin: UnwrapRef<typeof import('../../node_modules/nuxt/dist/app')['defineNuxtPlugin']>
readonly defineNuxtRouteMiddleware: UnwrapRef<typeof import('../../node_modules/nuxt/dist/app')['defineNuxtRouteMiddleware']>
readonly definePayloadPlugin: UnwrapRef<typeof import('../../node_modules/nuxt/dist/app')['definePayloadPlugin']>
readonly definePayloadReducer: UnwrapRef<typeof import('../../node_modules/nuxt/dist/app')['definePayloadReducer']>
readonly definePayloadReviver: UnwrapRef<typeof import('../../node_modules/nuxt/dist/app')['definePayloadReviver']>
readonly isNuxtError: UnwrapRef<typeof import('../../node_modules/nuxt/dist/app')['isNuxtError']>
readonly isPrerendered: UnwrapRef<typeof import('../../node_modules/nuxt/dist/app')['isPrerendered']>
readonly loadPayload: UnwrapRef<typeof import('../../node_modules/nuxt/dist/app')['loadPayload']>
readonly navigateTo: UnwrapRef<typeof import('../../node_modules/nuxt/dist/app')['navigateTo']>
readonly onNuxtReady: UnwrapRef<typeof import('../../node_modules/nuxt/dist/app')['onNuxtReady']>
readonly prefetchComponents: UnwrapRef<typeof import('../../node_modules/nuxt/dist/app')['prefetchComponents']>
readonly preloadComponents: UnwrapRef<typeof import('../../node_modules/nuxt/dist/app')['preloadComponents']>
readonly preloadPayload: UnwrapRef<typeof import('../../node_modules/nuxt/dist/app')['preloadPayload']>
readonly preloadRouteComponents: UnwrapRef<typeof import('../../node_modules/nuxt/dist/app')['preloadRouteComponents']>
readonly refreshNuxtData: UnwrapRef<typeof import('../../node_modules/nuxt/dist/app')['refreshNuxtData']>
readonly reloadNuxtApp: UnwrapRef<typeof import('../../node_modules/nuxt/dist/app')['reloadNuxtApp']>
readonly requestIdleCallback: UnwrapRef<typeof import('../../node_modules/nuxt/dist/app')['requestIdleCallback']>
readonly setPageLayout: UnwrapRef<typeof import('../../node_modules/nuxt/dist/app')['setPageLayout']>
readonly setResponseStatus: UnwrapRef<typeof import('../../node_modules/nuxt/dist/app')['setResponseStatus']>
readonly showError: UnwrapRef<typeof import('../../node_modules/nuxt/dist/app')['showError']>
readonly updateAppConfig: UnwrapRef<typeof import('../../node_modules/nuxt/dist/app')['updateAppConfig']>
readonly useAppConfig: UnwrapRef<typeof import('../../node_modules/nuxt/dist/app')['useAppConfig']>
readonly useAsyncData: UnwrapRef<typeof import('../../node_modules/nuxt/dist/app')['useAsyncData']>
readonly useCookie: UnwrapRef<typeof import('../../node_modules/nuxt/dist/app')['useCookie']>
readonly useError: UnwrapRef<typeof import('../../node_modules/nuxt/dist/app')['useError']>
readonly useFetch: UnwrapRef<typeof import('../../node_modules/nuxt/dist/app')['useFetch']>
readonly useLazyAsyncData: UnwrapRef<typeof import('../../node_modules/nuxt/dist/app')['useLazyAsyncData']>
readonly useLazyFetch: UnwrapRef<typeof import('../../node_modules/nuxt/dist/app')['useLazyFetch']>
readonly useNuxtApp: UnwrapRef<typeof import('../../node_modules/nuxt/dist/app')['useNuxtApp']>
readonly useNuxtData: UnwrapRef<typeof import('../../node_modules/nuxt/dist/app')['useNuxtData']>
readonly useRequestEvent: UnwrapRef<typeof import('../../node_modules/nuxt/dist/app')['useRequestEvent']>
readonly useRequestFetch: UnwrapRef<typeof import('../../node_modules/nuxt/dist/app')['useRequestFetch']>
readonly useRequestHeaders: UnwrapRef<typeof import('../../node_modules/nuxt/dist/app')['useRequestHeaders']>
readonly useRequestURL: UnwrapRef<typeof import('../../node_modules/nuxt/dist/app')['useRequestURL']>
readonly useRoute: UnwrapRef<typeof import('../../node_modules/nuxt/dist/app')['useRoute']>
readonly useRouter: UnwrapRef<typeof import('../../node_modules/nuxt/dist/app')['useRouter']>
readonly useRuntimeConfig: UnwrapRef<typeof import('../../node_modules/nuxt/dist/app')['useRuntimeConfig']>
readonly useState: UnwrapRef<typeof import('../../node_modules/nuxt/dist/app')['useState']>
// ../../node_modules/nuxt/dist/app/compat/vue-demi
readonly isVue2: UnwrapRef<typeof import('../../node_modules/nuxt/dist/app/compat/vue-demi')['isVue2']>
readonly isVue3: UnwrapRef<typeof import('../../node_modules/nuxt/dist/app/compat/vue-demi')['isVue3']>
// ../../node_modules/nuxt/dist/pages/runtime/composables
readonly definePageMeta: UnwrapRef<typeof import('../../node_modules/nuxt/dist/pages/runtime/composables')['definePageMeta']>
// ../../node_modules/vue
readonly computed: UnwrapRef<typeof import('../../node_modules/vue')['computed']>
readonly customRef: UnwrapRef<typeof import('../../node_modules/vue')['customRef']>
readonly defineAsyncComponent: UnwrapRef<typeof import('../../node_modules/vue')['defineAsyncComponent']>
readonly defineComponent: UnwrapRef<typeof import('../../node_modules/vue')['defineComponent']>
readonly defineModel: UnwrapRef<typeof import('../../node_modules/vue')['defineModel']>
readonly defineOptions: UnwrapRef<typeof import('../../node_modules/vue')['defineOptions']>
readonly defineSlots: UnwrapRef<typeof import('../../node_modules/vue')['defineSlots']>
readonly effect: UnwrapRef<typeof import('../../node_modules/vue')['effect']>
readonly effectScope: UnwrapRef<typeof import('../../node_modules/vue')['effectScope']>
readonly getCurrentInstance: UnwrapRef<typeof import('../../node_modules/vue')['getCurrentInstance']>
readonly getCurrentScope: UnwrapRef<typeof import('../../node_modules/vue')['getCurrentScope']>
readonly h: UnwrapRef<typeof import('../../node_modules/vue')['h']>
readonly hasInjectionContext: UnwrapRef<typeof import('../../node_modules/vue')['hasInjectionContext']>
readonly inject: UnwrapRef<typeof import('../../node_modules/vue')['inject']>
readonly isProxy: UnwrapRef<typeof import('../../node_modules/vue')['isProxy']>
readonly isReactive: UnwrapRef<typeof import('../../node_modules/vue')['isReactive']>
readonly isReadonly: UnwrapRef<typeof import('../../node_modules/vue')['isReadonly']>
readonly isRef: UnwrapRef<typeof import('../../node_modules/vue')['isRef']>
readonly isShallow: UnwrapRef<typeof import('../../node_modules/vue')['isShallow']>
readonly markRaw: UnwrapRef<typeof import('../../node_modules/vue')['markRaw']>
readonly mergeModels: UnwrapRef<typeof import('../../node_modules/vue')['mergeModels']>
readonly nextTick: UnwrapRef<typeof import('../../node_modules/vue')['nextTick']>
readonly onActivated: UnwrapRef<typeof import('../../node_modules/vue')['onActivated']>
readonly onBeforeMount: UnwrapRef<typeof import('../../node_modules/vue')['onBeforeMount']>
readonly onBeforeUnmount: UnwrapRef<typeof import('../../node_modules/vue')['onBeforeUnmount']>
readonly onBeforeUpdate: UnwrapRef<typeof import('../../node_modules/vue')['onBeforeUpdate']>
readonly onDeactivated: UnwrapRef<typeof import('../../node_modules/vue')['onDeactivated']>
readonly onErrorCaptured: UnwrapRef<typeof import('../../node_modules/vue')['onErrorCaptured']>
readonly onMounted: UnwrapRef<typeof import('../../node_modules/vue')['onMounted']>
readonly onRenderTracked: UnwrapRef<typeof import('../../node_modules/vue')['onRenderTracked']>
readonly onRenderTriggered: UnwrapRef<typeof import('../../node_modules/vue')['onRenderTriggered']>
readonly onScopeDispose: UnwrapRef<typeof import('../../node_modules/vue')['onScopeDispose']>
readonly onServerPrefetch: UnwrapRef<typeof import('../../node_modules/vue')['onServerPrefetch']>
readonly onUnmounted: UnwrapRef<typeof import('../../node_modules/vue')['onUnmounted']>
readonly onUpdated: UnwrapRef<typeof import('../../node_modules/vue')['onUpdated']>
readonly provide: UnwrapRef<typeof import('../../node_modules/vue')['provide']>
readonly proxyRefs: UnwrapRef<typeof import('../../node_modules/vue')['proxyRefs']>
readonly reactive: UnwrapRef<typeof import('../../node_modules/vue')['reactive']>
readonly readonly: UnwrapRef<typeof import('../../node_modules/vue')['readonly']>
readonly ref: UnwrapRef<typeof import('../../node_modules/vue')['ref']>
readonly resolveComponent: UnwrapRef<typeof import('../../node_modules/vue')['resolveComponent']>
readonly shallowReactive: UnwrapRef<typeof import('../../node_modules/vue')['shallowReactive']>
readonly shallowReadonly: UnwrapRef<typeof import('../../node_modules/vue')['shallowReadonly']>
readonly shallowRef: UnwrapRef<typeof import('../../node_modules/vue')['shallowRef']>
readonly toRaw: UnwrapRef<typeof import('../../node_modules/vue')['toRaw']>
readonly toRef: UnwrapRef<typeof import('../../node_modules/vue')['toRef']>
readonly toRefs: UnwrapRef<typeof import('../../node_modules/vue')['toRefs']>
readonly toValue: UnwrapRef<typeof import('../../node_modules/vue')['toValue']>
readonly triggerRef: UnwrapRef<typeof import('../../node_modules/vue')['triggerRef']>
readonly unref: UnwrapRef<typeof import('../../node_modules/vue')['unref']>
readonly useAttrs: UnwrapRef<typeof import('../../node_modules/vue')['useAttrs']>
readonly useCssModule: UnwrapRef<typeof import('../../node_modules/vue')['useCssModule']>
readonly useCssVars: UnwrapRef<typeof import('../../node_modules/vue')['useCssVars']>
readonly useModel: UnwrapRef<typeof import('../../node_modules/vue')['useModel']>
readonly useSlots: UnwrapRef<typeof import('../../node_modules/vue')['useSlots']>
readonly useTransitionState: UnwrapRef<typeof import('../../node_modules/vue')['useTransitionState']>
readonly watch: UnwrapRef<typeof import('../../node_modules/vue')['watch']>
readonly watchEffect: UnwrapRef<typeof import('../../node_modules/vue')['watchEffect']>
readonly watchPostEffect: UnwrapRef<typeof import('../../node_modules/vue')['watchPostEffect']>
readonly watchSyncEffect: UnwrapRef<typeof import('../../node_modules/vue')['watchSyncEffect']>
readonly withCtx: UnwrapRef<typeof import('../../node_modules/vue')['withCtx']>
readonly withDirectives: UnwrapRef<typeof import('../../node_modules/vue')['withDirectives']>
readonly withKeys: UnwrapRef<typeof import('../../node_modules/vue')['withKeys']>
readonly withMemo: UnwrapRef<typeof import('../../node_modules/vue')['withMemo']>
readonly withModifiers: UnwrapRef<typeof import('../../node_modules/vue')['withModifiers']>
readonly withScopeId: UnwrapRef<typeof import('../../node_modules/vue')['withScopeId']>
// ../../src/utils/config
readonly image: UnwrapRef<typeof import('../../src/utils/config')['image']>
readonly link: UnwrapRef<typeof import('../../src/utils/config')['link']>
readonly meta: UnwrapRef<typeof import('../../src/utils/config')['meta']>
readonly script: UnwrapRef<typeof import('../../src/utils/config')['script']>
// ../../src/utils/data
readonly isObject: UnwrapRef<typeof import('../../src/utils/data')['isObject']>
// ../../src/utils/env
readonly isDev: UnwrapRef<typeof import('../../src/utils/env')['isDev']>
readonly isProd: UnwrapRef<typeof import('../../src/utils/env')['isProd']>
// ../../src/utils/text
readonly markdown: UnwrapRef<typeof import('../../src/utils/text')['markdown']>
// ../vue-router
readonly onBeforeRouteLeave: UnwrapRef<typeof import('../vue-router')['onBeforeRouteLeave']>
readonly onBeforeRouteUpdate: UnwrapRef<typeof import('../vue-router')['onBeforeRouteUpdate']>
readonly useLink: UnwrapRef<typeof import('../vue-router')['useLink']>
}
}
declare module '@vue/runtime-core' {
interface ComponentCustomProperties {
// ../../node_modules/@unhead/vue
readonly injectHead: UnwrapRef<typeof import('../../node_modules/@unhead/vue')['injectHead']>
readonly useHead: UnwrapRef<typeof import('../../node_modules/@unhead/vue')['useHead']>
readonly useHeadSafe: UnwrapRef<typeof import('../../node_modules/@unhead/vue')['useHeadSafe']>
readonly useSeoMeta: UnwrapRef<typeof import('../../node_modules/@unhead/vue')['useSeoMeta']>
readonly useServerHead: UnwrapRef<typeof import('../../node_modules/@unhead/vue')['useServerHead']>
readonly useServerHeadSafe: UnwrapRef<typeof import('../../node_modules/@unhead/vue')['useServerHeadSafe']>
readonly useServerSeoMeta: UnwrapRef<typeof import('../../node_modules/@unhead/vue')['useServerSeoMeta']>
// ../../node_modules/nuxt/dist/app
readonly abortNavigation: UnwrapRef<typeof import('../../node_modules/nuxt/dist/app')['abortNavigation']>
readonly addRouteMiddleware: UnwrapRef<typeof import('../../node_modules/nuxt/dist/app')['addRouteMiddleware']>
readonly cancelIdleCallback: UnwrapRef<typeof import('../../node_modules/nuxt/dist/app')['cancelIdleCallback']>
readonly clearError: UnwrapRef<typeof import('../../node_modules/nuxt/dist/app')['clearError']>
readonly clearNuxtData: UnwrapRef<typeof import('../../node_modules/nuxt/dist/app')['clearNuxtData']>
readonly clearNuxtState: UnwrapRef<typeof import('../../node_modules/nuxt/dist/app')['clearNuxtState']>
readonly createError: UnwrapRef<typeof import('../../node_modules/nuxt/dist/app')['createError']>
readonly defineAppConfig: UnwrapRef<typeof import('../../node_modules/nuxt/dist/app')['defineAppConfig']>
readonly defineNuxtComponent: UnwrapRef<typeof import('../../node_modules/nuxt/dist/app')['defineNuxtComponent']>
readonly defineNuxtLink: UnwrapRef<typeof import('../../node_modules/nuxt/dist/app')['defineNuxtLink']>
readonly defineNuxtPlugin: UnwrapRef<typeof import('../../node_modules/nuxt/dist/app')['defineNuxtPlugin']>
readonly defineNuxtRouteMiddleware: UnwrapRef<typeof import('../../node_modules/nuxt/dist/app')['defineNuxtRouteMiddleware']>
readonly definePayloadPlugin: UnwrapRef<typeof import('../../node_modules/nuxt/dist/app')['definePayloadPlugin']>
readonly definePayloadReducer: UnwrapRef<typeof import('../../node_modules/nuxt/dist/app')['definePayloadReducer']>
readonly definePayloadReviver: UnwrapRef<typeof import('../../node_modules/nuxt/dist/app')['definePayloadReviver']>
readonly isNuxtError: UnwrapRef<typeof import('../../node_modules/nuxt/dist/app')['isNuxtError']>
readonly isPrerendered: UnwrapRef<typeof import('../../node_modules/nuxt/dist/app')['isPrerendered']>
readonly loadPayload: UnwrapRef<typeof import('../../node_modules/nuxt/dist/app')['loadPayload']>
readonly navigateTo: UnwrapRef<typeof import('../../node_modules/nuxt/dist/app')['navigateTo']>
readonly onNuxtReady: UnwrapRef<typeof import('../../node_modules/nuxt/dist/app')['onNuxtReady']>
readonly prefetchComponents: UnwrapRef<typeof import('../../node_modules/nuxt/dist/app')['prefetchComponents']>
readonly preloadComponents: UnwrapRef<typeof import('../../node_modules/nuxt/dist/app')['preloadComponents']>
readonly preloadPayload: UnwrapRef<typeof import('../../node_modules/nuxt/dist/app')['preloadPayload']>
readonly preloadRouteComponents: UnwrapRef<typeof import('../../node_modules/nuxt/dist/app')['preloadRouteComponents']>
readonly refreshNuxtData: UnwrapRef<typeof import('../../node_modules/nuxt/dist/app')['refreshNuxtData']>
readonly reloadNuxtApp: UnwrapRef<typeof import('../../node_modules/nuxt/dist/app')['reloadNuxtApp']>
readonly requestIdleCallback: UnwrapRef<typeof import('../../node_modules/nuxt/dist/app')['requestIdleCallback']>
readonly setPageLayout: UnwrapRef<typeof import('../../node_modules/nuxt/dist/app')['setPageLayout']>
readonly setResponseStatus: UnwrapRef<typeof import('../../node_modules/nuxt/dist/app')['setResponseStatus']>
readonly showError: UnwrapRef<typeof import('../../node_modules/nuxt/dist/app')['showError']>
readonly updateAppConfig: UnwrapRef<typeof import('../../node_modules/nuxt/dist/app')['updateAppConfig']>
readonly useAppConfig: UnwrapRef<typeof import('../../node_modules/nuxt/dist/app')['useAppConfig']>
readonly useAsyncData: UnwrapRef<typeof import('../../node_modules/nuxt/dist/app')['useAsyncData']>
readonly useCookie: UnwrapRef<typeof import('../../node_modules/nuxt/dist/app')['useCookie']>
readonly useError: UnwrapRef<typeof import('../../node_modules/nuxt/dist/app')['useError']>
readonly useFetch: UnwrapRef<typeof import('../../node_modules/nuxt/dist/app')['useFetch']>
readonly useLazyAsyncData: UnwrapRef<typeof import('../../node_modules/nuxt/dist/app')['useLazyAsyncData']>
readonly useLazyFetch: UnwrapRef<typeof import('../../node_modules/nuxt/dist/app')['useLazyFetch']>
readonly useNuxtApp: UnwrapRef<typeof import('../../node_modules/nuxt/dist/app')['useNuxtApp']>
readonly useNuxtData: UnwrapRef<typeof import('../../node_modules/nuxt/dist/app')['useNuxtData']>
readonly useRequestEvent: UnwrapRef<typeof import('../../node_modules/nuxt/dist/app')['useRequestEvent']>
readonly useRequestFetch: UnwrapRef<typeof import('../../node_modules/nuxt/dist/app')['useRequestFetch']>
readonly useRequestHeaders: UnwrapRef<typeof import('../../node_modules/nuxt/dist/app')['useRequestHeaders']>
readonly useRequestURL: UnwrapRef<typeof import('../../node_modules/nuxt/dist/app')['useRequestURL']>
readonly useRoute: UnwrapRef<typeof import('../../node_modules/nuxt/dist/app')['useRoute']>
readonly useRouter: UnwrapRef<typeof import('../../node_modules/nuxt/dist/app')['useRouter']>
readonly useRuntimeConfig: UnwrapRef<typeof import('../../node_modules/nuxt/dist/app')['useRuntimeConfig']>
readonly useState: UnwrapRef<typeof import('../../node_modules/nuxt/dist/app')['useState']>
// ../../node_modules/nuxt/dist/app/compat/vue-demi
readonly isVue2: UnwrapRef<typeof import('../../node_modules/nuxt/dist/app/compat/vue-demi')['isVue2']>
readonly isVue3: UnwrapRef<typeof import('../../node_modules/nuxt/dist/app/compat/vue-demi')['isVue3']>
// ../../node_modules/nuxt/dist/pages/runtime/composables
readonly definePageMeta: UnwrapRef<typeof import('../../node_modules/nuxt/dist/pages/runtime/composables')['definePageMeta']>
// ../../node_modules/vue
readonly computed: UnwrapRef<typeof import('../../node_modules/vue')['computed']>
readonly customRef: UnwrapRef<typeof import('../../node_modules/vue')['customRef']>
readonly defineAsyncComponent: UnwrapRef<typeof import('../../node_modules/vue')['defineAsyncComponent']>
readonly defineComponent: UnwrapRef<typeof import('../../node_modules/vue')['defineComponent']>
readonly defineModel: UnwrapRef<typeof import('../../node_modules/vue')['defineModel']>
readonly defineOptions: UnwrapRef<typeof import('../../node_modules/vue')['defineOptions']>
readonly defineSlots: UnwrapRef<typeof import('../../node_modules/vue')['defineSlots']>
readonly effect: UnwrapRef<typeof import('../../node_modules/vue')['effect']>
readonly effectScope: UnwrapRef<typeof import('../../node_modules/vue')['effectScope']>
readonly getCurrentInstance: UnwrapRef<typeof import('../../node_modules/vue')['getCurrentInstance']>
readonly getCurrentScope: UnwrapRef<typeof import('../../node_modules/vue')['getCurrentScope']>
readonly h: UnwrapRef<typeof import('../../node_modules/vue')['h']>
readonly hasInjectionContext: UnwrapRef<typeof import('../../node_modules/vue')['hasInjectionContext']>
readonly inject: UnwrapRef<typeof import('../../node_modules/vue')['inject']>
readonly isProxy: UnwrapRef<typeof import('../../node_modules/vue')['isProxy']>
readonly isReactive: UnwrapRef<typeof import('../../node_modules/vue')['isReactive']>
readonly isReadonly: UnwrapRef<typeof import('../../node_modules/vue')['isReadonly']>
readonly isRef: UnwrapRef<typeof import('../../node_modules/vue')['isRef']>
readonly isShallow: UnwrapRef<typeof import('../../node_modules/vue')['isShallow']>
readonly markRaw: UnwrapRef<typeof import('../../node_modules/vue')['markRaw']>
readonly mergeModels: UnwrapRef<typeof import('../../node_modules/vue')['mergeModels']>
readonly nextTick: UnwrapRef<typeof import('../../node_modules/vue')['nextTick']>
readonly onActivated: UnwrapRef<typeof import('../../node_modules/vue')['onActivated']>
readonly onBeforeMount: UnwrapRef<typeof import('../../node_modules/vue')['onBeforeMount']>
readonly onBeforeUnmount: UnwrapRef<typeof import('../../node_modules/vue')['onBeforeUnmount']>
readonly onBeforeUpdate: UnwrapRef<typeof import('../../node_modules/vue')['onBeforeUpdate']>
readonly onDeactivated: UnwrapRef<typeof import('../../node_modules/vue')['onDeactivated']>
readonly onErrorCaptured: UnwrapRef<typeof import('../../node_modules/vue')['onErrorCaptured']>
readonly onMounted: UnwrapRef<typeof import('../../node_modules/vue')['onMounted']>
readonly onRenderTracked: UnwrapRef<typeof import('../../node_modules/vue')['onRenderTracked']>
readonly onRenderTriggered: UnwrapRef<typeof import('../../node_modules/vue')['onRenderTriggered']>
readonly onScopeDispose: UnwrapRef<typeof import('../../node_modules/vue')['onScopeDispose']>
readonly onServerPrefetch: UnwrapRef<typeof import('../../node_modules/vue')['onServerPrefetch']>
readonly onUnmounted: UnwrapRef<typeof import('../../node_modules/vue')['onUnmounted']>
readonly onUpdated: UnwrapRef<typeof import('../../node_modules/vue')['onUpdated']>
readonly provide: UnwrapRef<typeof import('../../node_modules/vue')['provide']>
readonly proxyRefs: UnwrapRef<typeof import('../../node_modules/vue')['proxyRefs']>
readonly reactive: UnwrapRef<typeof import('../../node_modules/vue')['reactive']>
readonly readonly: UnwrapRef<typeof import('../../node_modules/vue')['readonly']>
readonly ref: UnwrapRef<typeof import('../../node_modules/vue')['ref']>
readonly resolveComponent: UnwrapRef<typeof import('../../node_modules/vue')['resolveComponent']>
readonly shallowReactive: UnwrapRef<typeof import('../../node_modules/vue')['shallowReactive']>
readonly shallowReadonly: UnwrapRef<typeof import('../../node_modules/vue')['shallowReadonly']>
readonly shallowRef: UnwrapRef<typeof import('../../node_modules/vue')['shallowRef']>
readonly toRaw: UnwrapRef<typeof import('../../node_modules/vue')['toRaw']>
readonly toRef: UnwrapRef<typeof import('../../node_modules/vue')['toRef']>
readonly toRefs: UnwrapRef<typeof import('../../node_modules/vue')['toRefs']>
readonly toValue: UnwrapRef<typeof import('../../node_modules/vue')['toValue']>
readonly triggerRef: UnwrapRef<typeof import('../../node_modules/vue')['triggerRef']>
readonly unref: UnwrapRef<typeof import('../../node_modules/vue')['unref']>
readonly useAttrs: UnwrapRef<typeof import('../../node_modules/vue')['useAttrs']>
readonly useCssModule: UnwrapRef<typeof import('../../node_modules/vue')['useCssModule']>
readonly useCssVars: UnwrapRef<typeof import('../../node_modules/vue')['useCssVars']>
readonly useModel: UnwrapRef<typeof import('../../node_modules/vue')['useModel']>
readonly useSlots: UnwrapRef<typeof import('../../node_modules/vue')['useSlots']>
readonly useTransitionState: UnwrapRef<typeof import('../../node_modules/vue')['useTransitionState']>
readonly watch: UnwrapRef<typeof import('../../node_modules/vue')['watch']>
readonly watchEffect: UnwrapRef<typeof import('../../node_modules/vue')['watchEffect']>
readonly watchPostEffect: UnwrapRef<typeof import('../../node_modules/vue')['watchPostEffect']>
readonly watchSyncEffect: UnwrapRef<typeof import('../../node_modules/vue')['watchSyncEffect']>
readonly withCtx: UnwrapRef<typeof import('../../node_modules/vue')['withCtx']>
readonly withDirectives: UnwrapRef<typeof import('../../node_modules/vue')['withDirectives']>
readonly withKeys: UnwrapRef<typeof import('../../node_modules/vue')['withKeys']>
readonly withMemo: UnwrapRef<typeof import('../../node_modules/vue')['withMemo']>
readonly withModifiers: UnwrapRef<typeof import('../../node_modules/vue')['withModifiers']>
readonly withScopeId: UnwrapRef<typeof import('../../node_modules/vue')['withScopeId']>
// ../../src/utils/config
readonly image: UnwrapRef<typeof import('../../src/utils/config')['image']>
readonly link: UnwrapRef<typeof import('../../src/utils/config')['link']>
readonly meta: UnwrapRef<typeof import('../../src/utils/config')['meta']>
readonly script: UnwrapRef<typeof import('../../src/utils/config')['script']>
// ../../src/utils/data
readonly isObject: UnwrapRef<typeof import('../../src/utils/data')['isObject']>
// ../../src/utils/env
readonly isDev: UnwrapRef<typeof import('../../src/utils/env')['isDev']>
readonly isProd: UnwrapRef<typeof import('../../src/utils/env')['isProd']>
// ../../src/utils/text
readonly markdown: UnwrapRef<typeof import('../../src/utils/text')['markdown']>
// ../vue-router
readonly onBeforeRouteLeave: UnwrapRef<typeof import('../vue-router')['onBeforeRouteLeave']>
readonly onBeforeRouteUpdate: UnwrapRef<typeof import('../vue-router')['onBeforeRouteUpdate']>
readonly useLink: UnwrapRef<typeof import('../vue-router')['useLink']>
}
}
Think this is something you could build in to the generation function?
Correct me if I am wrong, but currently the module can only be used with vuejs, webpack and rollup. I have used it with vuejs in the past and would like to use it on my typescript api projects.
This issue lists Renovate updates and detected dependencies. Read the Dependency Dashboard docs to learn more.
These updates are awaiting their schedule. Click on a checkbox to get an update now.
eslint
, vue
)These updates have all been created already. Click a checkbox below to force a retry/rebase of any.
.github/workflows/ci.yml
actions/checkout v4
actions/setup-node v4
codecov/codecov-action v4
package.json
@rollup/pluginutils ^5.1.0
acorn ^8.12.1
escape-string-regexp ^5.0.0
estree-walker ^3.0.3
fast-glob ^3.3.2
local-pkg ^0.5.0
magic-string ^0.30.11
mlly ^1.7.1
pathe ^1.1.2
pkg-types ^1.2.0
scule ^1.3.0
strip-literal ^2.1.0
unplugin ^1.13.1
@antfu/eslint-config ^2.27.3
@types/estree ^1.0.5
@types/node ^22.5.4
@vitest/coverage-v8 ^2.0.5
bumpp ^9.5.2
conventional-changelog-cli ^5.0.0
eslint ^9.9.1
h3 ^1.12.0
jquery ^3.7.1
lit ^3.2.0
typescript ^5.5.4
unbuild ^2.0.0
vitest ^2.0.5
vue-tsc ^2.1.6
pnpm 9.9.0
playground/package.json
vue ^3.5.2
@vitejs/plugin-vue ^5.1.3
typescript ^5.5.4
vite ^5.4.3
vite-plugin-inspect ^0.8.7
node20
When using vue and vueuse presets you get duplicated imports:
Duplicated imports "toRef", the one from "vue" has been ignored and "@vueuse/core" is used
Duplicated imports "toValue", the one from "vue" has been ignored and "@vueuse/core" is used
Should this be addressed in the preset? Can this be resolved via config?
No response
Duplicated imports "toRef", the one from "vue" has been ignored and "@vueuse/core" is used
Duplicated imports "toValue", the one from "vue" has been ignored and "@vueuse/core" is used
How do you guys do something like this? Why it works in case of zod but not in case of mongoose and jasonwebtocket?
{
imports: [
{
from: "jsonwebtoken",
name: "default",
as: "jwt",
},
],
presets: [
{
from: "zod",
imports: ["z"],
},
{
from: "mongoose",
imports: ["model"],
}
],
}
In a Nuxt 3 project I am trying to use the following config to make SFC components auto-importable in JS code:
export default defineNuxtConfig({
imports: {
dirs: ['components/**/*'],
}
This almost works, but the components have to be referenced with camel-case names instead of their original pascal-case names, e.g. (from .nuxt/types/imports.d.ts
):
const pageFooter: typeof import('../../components/PageFooter')['default']
This is caused by the use of camelCase()
in this line here:
Line 68 in df6e341
I looked at scule
and it appears to split at '-', '_', '/', '.'
to do the transformation:
https://github.com/unjs/scule/blob/249072ac10d1f441a23eb9df7bcb1bfc1e13d419/src/index.ts#L4
I'd like to suggest a change where the name is first inspected, and only if it contains any of these characters, will it be transformed using camelCase()
. Otherwise it is passed on unmodified:
// Only camelize name if it contains separators by which scule would split,
// see STR_SPLITTERS: https://github.com/unjs/scule/blob/main/src/index.ts
const as = /[-_.]/.test(name) ? camelCase(name) : name
imports.push({ name: 'default', as, from: filepath })
Note that there is no need to check for /
since it's only a file-name, not a path, at this point.
I believe these two annotations should be added at the top of the generated d.ts file to prevent conflicts with the project configuration.
I forked this repo in order to hunt down a bug with commented out exports (cc: nuxt/nuxt#14971) and I noticed after npm installing that there's a dependency on vue/compiler-sfc
, failing a test. I think it just needs to be @vue/compiler-sfc
.
Side note (and I can open another issue for this if required), when running npm run dev
the absolute import test fails as it tries to find a.vue
which doesn't exist in the project.
v3.7.1
v18.16.1
https://github.com/aklinker1/unimport-tsx-bug
pnpm i
node index.mjs
When components/index.ts
exports a subdirectory with a index.tsx
file in it, an error is throw (see logs below).
Same error is thrown if the file is components/Iframe/index.jsx
.
There is a work-around, change the export in components/index.ts
:
-export * from "./Iframe";
+export * from "./Iframe/index.tsx";
This issue originates from: wxt-dev/wxt#440
I did some research into this and it appears we just need to add "tsx"
and "jsx"
to the file extensions array?
Lines 41 to 48 in 8a622c9
#229 fixed this for non-JSX files.
$ node index.mjs
node:internal/process/esm_loader:97
internalBinding('errors').triggerUncaughtException(
^
[Error: EISDIR: illegal operation on a directory, read] {
errno: -21,
code: 'EISDIR',
syscall: 'read'
}
Node.js v18.16.1
unimport/unplugin
)Here's a stackblitz minimal reproduction :
https://stackblitz.com/edit/nuxt-starter-jxv1vc?file=.nuxt%2Ftypes%2Fimports.d.ts
Produced entry on imports.d.ts :
const someDemoFunction: typeof import('../../services/demo')['someDemoFunction']
The '.service' part of the file name have been stripped away
No response
No response
I was looking through the Nuxt source code and saw it uses defineUnimportPreset
in some places. However, upon reading the source code here, it seems the defineUnimportPreset
does nothing but return the passed in parameter. It doesn't even re-type it. What is the use of this function? Does it cause some obscure side effect that is desired, is it a "functional" way of ensuring the type of the preset is correct, or is it something else? If it is a type thing, why use that pattern over simply exporting the type information?
I have tried using unimport with Astro JS. The plugin works perfectly well in .js(x)- and .ts(x)-files, but not in .astro-files. It simply says X is not defined. I have tried investigating the issue, but I have been unable to find and explanation thus far. Maybe someone else will be able to implement a solution.
One downside of auto-import is that some people would be concerned about the implicitness and uncertainty of where a function has been imported.
Wonder if we can come up with an optional eslint plugin that automatically inserts the import statement into the file.
Unlike the IDE auto-insertion that often injects the wrong path, and only available when you are typing that entry or explicitly clicking on the entry. Unimport maintains a list of imports with unique names, so that you always get the correct path. Meanwhile, with an ESLint Plugin, you can run it with a CLI and even filter the files you want it to enable. Combined with rules like https://www.npmjs.com/package/eslint-plugin-unused-imports, you can get autofix when you add or remove functions. Make the import statements almost fully automated.
Looking into the exported types of Vue, I noticed the absence of the 'ExportPropTypes' export. Is there a specific reason for not including this or other types? Should I manually add an import for this type from Vue in my 'unplugin-auto-import' configuration instead?
src/presets/vue.ts
// types
...[
'Component',
'ComponentPublicInstance',
'ComputedRef',
'InjectionKey',
'PropType',
'Ref',
'VNode',
'WritableComputedRef'
].map(name => ({ name, type: true }))
Thanks in advance!
Automatic imports are nice, but sometimes you don't want to clutter your virtual global scope with a lot of different things that share something in common. It would be great if Unimport could help you in situations like this.
Imagine a situation where you have a folder messages
where each file would contain its own localisable message declarations exported as defaults:
// messages/page-titles.ts
export default defineMessages({
projects: {
id: 'page.projects.title',
defaultMessage: 'Projects',
},
})
// messages/errors.ts
export default defineMessages({
notFound: {
id: 'error.not-found',
defaultMessage: 'Resource not found',
},
})
// messages/utils.ts
export function getWorldGreeting() {
return defineMessage({
id: 'greetings.world',
defaultMessage: 'Hello, world!',
})
}
You don't really want to import each file separately, since pageTitles
and errors
are quite confusing. Nor do you want to rely on some naming conventions (like having files named like errors-messages
to keep it clean.
In this case you'd likely prefer to have a globalMessages
namespace, that would've contained all the imports than Unimport discovered, like pageTitles
, errors
, and anything else. It would also tree-shaking, as if you've done a specific import rather than imported everything at once.
To do so manually without Unimport right now you can make a barrel file:
// messages/index.barrel.ts
import pageTitles from "./page-titles.ts"
import errors from "./errors.ts"
export * from "./utils.ts"
export { pageTitles, errors }
And then the file that would export that barrel:
// messages/index.ts
export * as globalMessages from "./index.barrel.ts";
Now you can import { globalMessages } from '~/messages'
. You can also add this to your Unimport.
But what if Unimport could group imports like this automatically for you?
You'd add a scan option:
unimport.vite({
dirs: [
'./utils/*',
{ from: './messages/*', as: 'globalMessages' },
],
})
… and then would be able to use that through ‘variable’:
// input: pages/projects/index.vue/<script setup>
console.log(formatMessage(globalMessages.pageTitles.projects))
declare global {
const globalMessages: Readonly<{
pageTitles: typeof import('../../messages/page-titles.ts')['default']
errors: typeof import('../../messages/errors.ts')['default']
getWorldGreeting: typeof('../../messages/utils.ts')['getWorldGreeting']
}>
}
… which would expand to something along the lines of:
// output: pages/projects/index.vue/<script setup>
import pageTitles from '../../messages/page-titles.ts'
console.log(formatMessage(pageTitles.projects))
It may also work with other language features like destructuring, as long as it's deterministic (did you know that something like this would blow up tree-shaking in rollup?):
// src/a.js
const { pageTitles: { projects: projectsTitle } } = globalMessages
// src/a.js [transformed]
import pageTitles from '../../messages/page-titles.ts'
const { projects: projectsTitle } = pageTitles
Cloned repository on Windows 10 22H2 running Node v16.17.0
Change playground/composables/nested/index.ts
to
export default function () {
return 'from nested composables'
}
+ export * from './bar'
Lines 50 to 59 in 1be4b7b
scanExports
is likely to assume that filepath
is indeed a filepath while it can be a directory, and so readFile
fails for the above example where the filepath is playground/composables/nested/bar
(with no file extension lookup available for it).
Options I can think of:
/index
exists.Lines 91 to 94 in 1be4b7b
if (existsSync(`${subfilepath}${ext}`)) {
subfilepath = `${subfilepath}${ext}`
break
+} else if (existsSync(`${subfilepath}/index${ext}`)) {
+ // 'foo' is a directory
+ subfilepath = `${subfilepath}/index${ext}`
+ break
+}
Line 104 in 1be4b7b
- imports.push(...await scanExports(subfilepath, seen))
+ imports.push({ name: '*', from: subfilepath })
No response
Disclaimer: this is using npm
.
When trying to run the playground (after an npm i
), the server throws the following error:
[plugin:unimport] s.hasChanged is not a function
/Users/reinierkaper/personal/unimport/playground/src/main.ts
at TransformContext.transform (file:///Users/reinierkaper/personal/unimport/playground/vite.config.ts.timestamp-1663630386798.mjs:1067:14)
at processTicksAndRejections (node:internal/process/task_queues:96:5)
at async file:///Users/reinierkaper/personal/unimport/playground/node_modules/vite-plugin-inspect/dist/index.mjs:676:23
at async Object.transform (file:///Users/reinierkaper/personal/unimport/playground/node_modules/vite/dist/node/chunks/dep-557f29e6.js:41102:30)
at async loadAndTransform (file:///Users/reinierkaper/personal/unimport/playground/node_modules/vite/dist/node/chunks/dep-557f29e6.js:37364:29
System: MacOS 12.5.1
Browser: Chrome 105.0.5195.125
Node: 16.15.1
npm: 8.12.1
While working on unjs/nitro#866 i noticed that dirs
option is only supported for unimport plugin but not unimport core and for generating types, it should be manually integrated with scanDirExports
and modifyDynamicImports
(there might be better ways no ideas).
it would be nice if we support it built-in to avoid workaround.
Reproduction: https://stackblitz.com/edit/node-x74ruz?file=index.mjs,utils%2Ftest.ts
(PS: Small unrelated bug i found generateTypeDeclarations
is not stripping .ts
from paths resulting into ts issues)
Hi,
though vuejs' computed
can return ComputedRef
and WritableComputedRef
, I'd expect those two to be a preset return type as well. (corresponding PR incoming)
Request to add an addon for MDX file.
Related issue: unplugin/unplugin-auto-import#293
Node v18.16.0, Nuxt 3.7.1, Unimport 3.3.0
In v3.3.0 both the .d.ts
and .mjs
files are being imported from a linked package, causing import warnings.
I have a nuxt module that registers a directory of composables for auto-import. It works fine when installed to node_modules
, but as of [email protected]
there is now a warning that occurs whens the module is linked.
Duplicated imports "useLog", the one from "[path to package]/dist/runtime/composables/core/useLog.d.ts" has been ignored
It looks like scanFilesFromDir
should be ignoring the .d.ts
files, but it doesn't work when the package is linked.
No response
No response
Vue allows for easily making use of custom template files (SFCs). In Stacks, we are experimenting with .stx
files, which, essentially, are *.vue files with access to a bunch of auto-imported APIs.
The issue I am facing is that, as seen in the attached screenshot, onMounted()
is an auto-imported API, but it's not accessible inside .stx files. If changed to HelloWorld.vue, it works.
Any tips appreciated, as I am still trying to make sense of it 🙂
The auto-import feature is convenient to use but sometimes could be confusing when users accidentally introduce circular auto-import references for accidentally introducing unnecessary references to some modules. Being about to opt-out auto-import for some modules could help to make some parts better organized.
Here are a few raw ideas:
We could do a quick RegExp check in the transforming phase to have fine-grained opt-out of some modules:
// @imports-disable
// @unimport-disable
I guess it's already possible by setting the exclude
options to exclude by globs.
Unimport({
exclude: [
'composables/**'
]
}
The issue we could need to solve might be to opt-out of the global TypeScript declarations for those modules.
Taking it a bit further, we might do automatic import injection. We could have a comment marking the module as:
// @unimport-auto-inject
import { foo } from './foo'
And once you used a new import from the auto-import registry, let say bar
:
// @unimport-auto-inject
import { foo } from './foo'
console.log(bar)
In development mode, we could inject the bar
import automatically. Once we save the file, unimport
will see the new usage communing and inject it like this:
// @unimport-auto-inject
+ import { bar } from './bar' // auto injected on save
import { foo } from './foo'
console.log(bar)
This way, it can help users make clear what and where the imports are auto-imported without worrying them too much.
unimport version: v3.3.0
node.js version: v18.16.0
import { createUnimport } from 'unimport'
const code = `
{
const fn = () => {};
};
fn();
`
const { injectImports } = createUnimport({
imports: [{ name: 'fn', from: 'module' }]
})
const { imports } = await injectImports(code)
console.log(imports)
Lines 247 to 256 in 28cf011
Before Remove those already defined
, the value of occurrenceMap
is { size:1, [{ "fn" => 30 }] }
, where fn
refers to the function which is called outside of the block scope.
While run into the for loop, strippedCode
will match regexp /\b(?:const|let|var)\s+?(\[.*?\]|\{.*?\}|.+?)\s*?[=;\n]/gs
, and matching result is [ "const fn =", "fn" ]
, where fn
refers to the function defined inside the block scope. So occurrenceMap.delete(identifier)
will be executed, occurrenceMap
will be cleared, and finally no import
statement will be prepended to the code.
Seems in this situation, regexp matching is not enough, and lexical analysis may be needed?
No response
No response
For example:
class Foo extends Bar {}
Bar is registered but not auto-imported.
Linked issue: unplugin/unplugin-auto-import#301
I'd like to implement but I need some time to read the code :(
I using this lib with Vite as
const ctx = createUnimport({
presets: ['vue', '@vueuse/core'],
addons: { vueTemplate: true },
})
and this configuration gives me
TypeError [ERR_INVALID_ARG_TYPE]: The "path" argument must be of type string or an instance of Buffer or URL. Received undefined
at __node_internal_captureLargerStackTrace (node:internal/errors:477:5)
at new NodeError (node:internal/errors:388:5)
at __node_internal_ (node:internal/fs/utils:673:11)
at __node_internal_ (node:internal/fs/utils:685:3)
at Object.openSync (node:fs:591:10)
at Object.readFileSync (node:fs:467:35)
at vueuseCore (/Users/amaurytobias/garsa/garsa-pdf/node_modules/.pnpm/[email protected][email protected]/node_modules/unimport/dist/chunks/context.cjs:311:41)
at /Users/amaurytobias/garsa/garsa-pdf/node_modules/.pnpm/[email protected][email protected]/node_modules/unimport/dist/chunks/context.cjs:547:16
at Array.flatMap (<anonymous>)
at resolveBuiltinPresets (/Users/amaurytobias/garsa/garsa-pdf/node_modules/.pnpm/[email protected][email protected]/node_modules/unimport/dist/chunks/context.cjs:544:18)
at createUnimport (/Users/amaurytobias/garsa/garsa-pdf/node_modules/.pnpm/[email protected][email protected]/node_modules/unimport/dist/chunks/context.cjs:629:29)
at <anonymous> (/Users/amaurytobias/garsa/garsa-pdf/packages/builder/utils/kit.ts:324:15)
at Object.<anonymous> (/Users/amaurytobias/garsa/garsa-pdf/node_modules/.pnpm/[email protected][email protected]/node_modules/unplugin/dist/index.js:4:688)
at writeTypes (/Users/amaurytobias/garsa/garsa-pdf/packages/builder/utils/prepare.ts:130:32)
at Object.invoke (/Users/amaurytobias/garsa/garsa-pdf/packages/builder/commands/prepare.ts:18:5)
at _main (/Users/amaurytobias/garsa/garsa-pdf/packages/builder/cli.ts:18:18) {
code: 'ERR_INVALID_ARG_TYPE'
}
On unplugin-auto-import the @vueuse/core preset is different on the lines: 14:24
(unimport)[https://github.com/unjs/unimport/blob/main/src/presets/vueuse-core.ts]
const path = resolveModule('@vueuse/core/indexes.json')
const indexesJson = JSON.parse(readFileSync(path!, 'utf-8'))
_cache = defineUnimportPreset({
from: '@vueuse/core',
imports: indexesJson
.functions
.filter((i: any) => ['core', 'shared'].includes(i.package))
.map((i: any) => i.name as string)
// only include functions with 4 characters or more
.filter((i: string) => i && i.length >= 4 && !excluded.includes(i))
})
const corePath = resolveModule('@vueuse/core') || process.cwd()
const path = resolveModule('@vueuse/core/indexes.json')
|| resolveModule('@vueuse/metadata/index.json')
|| resolveModule('@vueuse/metadata/index.json', { paths: [corePath] })
indexesJson = JSON.parse(readFileSync(path!, 'utf-8'))
idk if this can resolve the issue.
I really wish to be able to use export * from 'foo'
. By looking at implemented tests, I assume this is currently not possible. It doesn't seem like a rare use-case, and as as
is already optional, I don't see a reason to not support it.
unimport: 3.0.11
node: v18.16.1
I raised this issue initially in Nuxt but soon realised the issue appears to come from this package.
When using toExports
with any export name containing anything that looks like an extension such as chart.js
the issue presents.
The issue is caused by:
Line 121 in 7df98d0
This attempts to strip anything that looks like an extension from the name resulting in the incorrectly generated import from something like chart.js
of just chart
.
As a temporary workaround you can simply change it to chart.JS
which avoids this regex matching. However this may also be an issue that this extension stripping should perhaps not be case-sensitive?
Not sure how to achieve this but the extension stripping should never be done on packages. Could we perhaps change the matcher to only concern itself with something which starts with ./
or a multi part filepath always ignoring the first segment?
No response
No response
I'm trying to incorporate unimport in a serverless.js
building pipeline with the goal of automating part of the bindings that are currently done manually to connect the lambdas.
However, while it works fine for not having to manually import the lambda in the config file, you still must add it to the functions object. The code looks more or less like this:
// import hello from functions/hello/index.ts // automated by unimport
const config = {
// ...
functions: {
hello,
// ...
}
}
I was wondering whether unimport imported exports could be grouped in an object, so to get something like:
const config = {
// ...
functions: {
... unimport()
}
}
node 16
Nuxt 3
stackblitz
sfc playground
Nuxt 3 original issue by @FRSgit
As you can see in the SFC Playground, vue prepend _ctx
to every variables from the setup. This cause the unimport plugin to replace a variable even if it has been declared it the setup of the component
No response
No response
if the input content is something like
export * from './aaa'
then noting will be processed
should we parsing the nesting export file (aaa.ts)?
I am wondering why the current implementation of the scanDirExports
is sorting the list of files after normalizing them. This is a major drawback as it does not allow you to set an explicit order of directories to scan and therefore of exports to override in case there's another one.
When using Nuxt 3 auto-imports, I would expect this option:
imports: {
dirs: ['foo', 'bar']
}
to let exports from bar
override exports from foo
, but since the filenames are sorted, exports from foo
will always override exports from bar
.
I can make a simple PR to prevent that sorting but I'm not exactly sure why it was there in the first place?
Thanks for your amazing work 🙏
https://stackblitz.com/edit/nuxt-issues-24422
When importing a variable like $myValue
, it is not accessible in the Vue template.
Interestingly, the types are set/augmented correctly 🤔
No response
18.15.0
import Unimport from 'unimport/unplugin'
export default (options: UserOptions = {}): Plugin[] => {
return [
...
UnimportPlugin.vite(),
...
].flat()
}
gets compiled to:
const index = (options = {}) => {
const Unimport = require('unimport/unplugin');
const UnimportPlugin = "default" in Unimport ? Unimport.default : Unimport;
return [
...
Unimport.vite(),
...
].flat();
};
module.exports = index;
It should be Unimport.default.vite
though
is this an issue with unimport or unbuild?
I'm using "unbuild": "^1.1.2"
The use case is that I have a meta plugin that preconfigures a bunch of plugins.
I have a workaround, but would like to know why this happens.
Thank you =)
No response
Hi! Great library.
I've encountered an issue with detecting usage of autoimported variables. If there's nested quotes (some quotes inside template literal), autoimported vars won't be detected and autoimport won't happen. Consider following example (assuming tc
should be autoimported):
// Leave one line below uncommented
// const str = `${tc.log1()}`; // works
const str = `'${tc.log1()}'`; // doesnt work
// const str = `"${tc.log1()}"`; // doesnt work
// const str = `${`test${tc.log1()}`}`; // doesnt work
document.querySelector('#app').innerHTML = `
<h1>Hello Vite! ${str}</h1>
`;
Full repro: https://stackblitz.com/edit/vite-hmbiei?file=main.js (it will crash when any line with "doesnt work" is uncommented)
We can directly use the npm package to automatically detect their exports and use it as a preset. Currently, it is only possible to use manual presets and a list of their exports.
In order to extract exports, we have 3 possible ways:
Using the last method is safest because packages can exactly annotate their exports and use a built step plugin (unbuild or rollup) to automate this meta generation process into dist/unimport.json
. We can then refer it from package.json
using "unimport": "./dist/unimport.json"
When packages are not bundled in this way, we can fallback to mlly.resolveModuleExportNames and use fast static analyzes to extract export names.
In order to have better control over auto-infered exports, we might exprot a filter function from presets. I imagine preset looking like this:
presets: [{
package: 'h3',
exports: 'auto' | 'analyze' // Default is auto - Tries `autoImport` in pacakge.json then analyzes
ignore: ['h', (name) => !name.startsWith('use')]
}]
In order to speed up the performance, we might use global cache in {os.tmpDir}/unimport/{package}/{version}/exports.json
containing exports and an integrity field to validate cache entry.
(This is a summary of discussing together with @antfu)
The issue has been reproduced in the following environment.
The simplest reproduction could look like this:
import { createUnimport } from 'unimport'
const { injectImports } = createUnimport({
imports: [{ name: 'store', from: 'module-store' }],
virtualImports: ['#imports'],
})
const input = "// import { store } from '#imports'"
const { code } = await injectImports(input)
console.log(code)
// import { store } from 'module-store';
// //
While, a more realistic reproduction would look like this:
import { createUnimport } from 'unimport'
const { injectImports } = createUnimport({
imports: [{ name: 'store', from: 'module-store' }],
virtualImports: ['#imports'],
})
const input = `export const store = {
/**
* @example
* import { store } from '#imports'
* store.fetch()
*/
fetch: () => {}
}`
const { code } = await injectImports(input)
console.log(code)
// import { store } from 'module-store';
// export const store = {
// /**
// * @example
// * * store.fetch()
// */
// fetch: () => {}
// }
When unimport is given code with comments that include imports from virtual modules, those comments are taken into account to know whether imports should be injected or not.
In the reproduction above, we can see two things:
In this specific scenario where comments are used to showcase how to use this piece of code, the result code will crash if executed. Indeed, there are now two variables with the same name:
import { store } from '#imports'
).const store
).From my understanding, I would expect imports in comments not to be taken into account when figuring out whether imports should be injected or not.
I tracked this issue down from a Nuxt application where I first encountered the issue.
No response
unimport: 3.0.2,
npm: '8.1.2',
node: '16.13.2',
https://stackblitz.com/edit/vitejs-vite-z2qfyt
Run npm run build
in the project root to reproduce the build error.
In this repro stackblitz, I have a simple Vite project that uses the vue-ts template. I have included the unimport plugin that uses the Vue preset.
Outside the src folder, I have a my-module
module that simulates an npm package.
This module has index.js
that contains one of the auto imported function from Vue as a variable name. In the example, I used ref
const u = Object.defineProperty,
ref = Object.getOwnPropertyNames;
export function getProperties(obj) {
return ref.call(null, obj);
}
I consume this module in src/main.ts
and when I try to build using Vite, I get the following error.
Identifier 'ref' has already been declared
If I were to change the my-module/index.js
to this format
const u = Object.defineProperty;
const ref = Object.getOwnPropertyNames;
export function getProperties(obj) {
return ref.call(null, obj);
}
And rebuild using Vite. Everything goes fine. It seems to have issue when variables are declared like const foo = 'bar', ref = 'baz'
.
I can fix this issue my ignoring ref
from the import. But similar issues could occur for any other identifier e.g. h
So I think this issue needs to be addressed by unimport
itself.
No response
Identifier 'ref' has already been declared
file: /home/projects/vitejs-vite-z2qfyt/my-module/index.js:7:0
5: // BREAKS
6: const u = Object.defineProperty,
7: ref = Object.getOwnPropertyNames;
^
8:
9: export function getProperties(obj) {
error during build:
RollupError: Identifier 'ref' has already been declared
at error (file://file:///home/projects/vitejs-vite-z2qfyt/node_modules/rollup/dist/es/shared/node-entry.js:2130:30)
at Module.error (file://file:///home/projects/vitejs-vite-z2qfyt/node_modules/rollup/dist/es/shared/node-entry.js:13199:16)
at Module.tryParse (file://file:///home/projects/vitejs-vite-z2qfyt/node_modules/rollup/dist/es/shared/node-entry.js:13876:25)
at Module.setSource (file://file:///home/projects/vitejs-vite-z2qfyt/node_modules/rollup/dist/es/shared/node-entry.js:13486:39)
at ModuleLoader.addModuleSource (file://file:///home/projects/vitejs-vite-z2qfyt/node_modules/rollup/dist/es/shared/node-entry.js:23447:20)
Bug scene:
When I use unplugin-auto-import
with vitest
, and I execute obj.fit()
in page, vite throw an error about can not use vitest in browser env
.
Possible question:
When get identifiers
in function detectImports
,
it will resolve a string which likes obj.fit()
, to an unexpected result as ["obj", "it"]
,
then it leads to the page imports the vitest
, so the error occurs.
Possible solution:
If we don't take care of the keyword after dot,
maybe we can change matchRE
regexp to /(?<![\w_$/).])([\w_$]+)\s*(?:[(.)[\]};+*&|
<>,\n-])/g`;
(For pnpm/pnp support.)
unplugin/unplugin-auto-import#115
Maybe for Svelte as well in the future
A declarative, efficient, and flexible JavaScript library for building user interfaces.
🖖 Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.
TypeScript is a superset of JavaScript that compiles to clean JavaScript output.
An Open Source Machine Learning Framework for Everyone
The Web framework for perfectionists with deadlines.
A PHP framework for web artisans
Bring data to life with SVG, Canvas and HTML. 📊📈🎉
JavaScript (JS) is a lightweight interpreted programming language with first-class functions.
Some thing interesting about web. New door for the world.
A server is a program made to process requests and deliver data to clients.
Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.
Some thing interesting about visualization, use data art
Some thing interesting about game, make everyone happy.
We are working to build community through open source technology. NB: members must have two-factor auth.
Open source projects and samples from Microsoft.
Google ❤️ Open Source for everyone.
Alibaba Open Source for everyone
Data-Driven Documents codes.
China tencent open source team.