-
Notifications
You must be signed in to change notification settings - Fork 7
New issue
Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.
By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.
Already on GitHub? Sign in to your account
feat: add sources option to allow loading external component definition #60
Conversation
Thanks for the PR @stafyniaksacha How do people generate those pre-computed meta file? Would be nice to add some document to it since it's a bit of a black box from what I try to understand |
First, I need to talk about the issue. When using a module living in This is a basic example: <script setup lang="ts">
const meta = await useComponentMeta('UButton')
</script>
<template>
<div>
<UButton>Button</UButton>
<!-- props, slots, events, exposed are all empty -->
<pre>{{ meta.meta }}</pre>
</div>
</template>
Also, to me, it does not make sense to scan those components each time we start our nuxt app, as they are not likely to change during development. The solution I've imagined is that when publishing a component library, we can include those pre-computed meta into the package (at the cost of package size, but we can publish to another meta package). This PR aims to be able to load and merge pre-computed meta into our app, so we can make our In order to generate the pre-computed meta in our component library, we can't simply add the
I think this CLI should be added into this repo if you are ok with the idea. Then, we can update our component library modules to register those meta if |
Having pre-compiled meta is a good idea to fix typescript exclude issue, and also it will improve performance of development and build. Having a CLI to generate meta is also a good Idea. Personally, I would like to ship these pre-compiled meta within the components package and not as a different package, therefore I think we might define an output directory for CLI to write generated meta files. This also make it easier for developers to use the CLI and publish meta as separate package. Additionally, we can create a hook ( Looking forward to seeing the CLI implementation on your PR :) |
src/module.ts
Outdated
@@ -26,6 +26,7 @@ export default defineNuxtModule<ModuleOptions>({ | |||
rootDir: nuxt.options.rootDir, | |||
componentDirs: [], | |||
components: [], | |||
sources: [], |
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
I think using metaSources
might be a better name for this option and will be consistent with metaFields
Also, CLI should generate all metaFields
and module can filter them before using them.
In addtion, we might find a hook in nuxt module builder to precompute this meta after mkdist job to prebundle them 👍🏼 This is a lovely and nice perf enhancement ❤️ |
…outside of runtime folder
@farnabaz @pi0 The cli is ready for review! You can use it with: # build with unbuild
pnpm prepack
# generate meta from playground
./bin/nuxt-component-meta.mjs playground --no-schema The There is an issue with the prop type detection into the playground, comment module registration in the nuxt config like: modules: [
'@nuxt/content',
'pinceau/nuxt',
// nuxtMetaModule as any
], I think it's due to typescript that can not resolve typing, it's working great when targeting a project that already have older version of this module |
@farnabaz any chance to see it merged? |
cc @farnabaz |
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
Sorry for late response.
LGTM ❤️ 🚀
This PR add a new
sources
option to allow loading pre-computed component meta file.(This does not cover sources generation, but I have a naive approach here with this)