Movatterモバイル変換


[0]ホーム

URL:


Skip to content

Navigation Menu

Sign in
Appearance settings

Search code, repositories, users, issues, pull requests...

Provide feedback

We read every piece of feedback, and take your input very seriously.

Saved searches

Use saved searches to filter your results more quickly

Sign up
Appearance settings

[QUESTION] Auto-import custom directives#866

Unanswered
go4cas asked this question inQ&A
Discussion options

Is there a guideline on how to auto-import custom directives (Vue 3, using Vite)?

In the config, I have setdirectives: true and even addeddirs: ['./src/components', './src/directives'],, but somehow I still get "Failed to resolve directive: format " warnings.

Anything else I missed in the config? How should the directive be structured in the file?

You must be logged in to vote

Replies: 1 comment

Comment options

@go4cas It does, but you need to write a custom resolver.

Instead of:

unpluginVueComponents({directives:true,dirs:["./src/components","./src/directives"],}),

Use something like:

import{kebabCase}from"lodash-es";importfsfrom"node:fs/promises";unpluginVueComponents({dirs:["./src/components"],resolvers:[{type:"directive",resolve:async(name)=>{// Convert the filename so that it's exactly the same on disk and// when used.constfilename=`v-${kebabCase(name)}.js`;// Check that the file exists, otherwise it would create imports// pointing nowhere for all directives that don't exist.return(awaitfs.exists(`src/directives/${filename}`))          ?// The path has to be absolute (or aliased).`@directives/${filename}`          :null;},},],}),

The directive files then have to each export the directive as the default export:

exportdefault{mounted(){// …},updated(){// …},unmounted(){// …},};
You must be logged in to vote
0 replies
Sign up for freeto join this conversation on GitHub. Already have an account?Sign in to comment
Category
Q&A
Labels
None yet
2 participants
@go4cas@Thomaash
Converted from issue

This discussion was converted from issue #741 on July 18, 2025 00:53.


[8]ページ先頭

©2009-2025 Movatter.jp