epicmaxco / vuestic-ui

Vuestic UI is an open-source Vue 3 component library designed for rapid development, easy maintenance, and high accessibility. Maintained by Epicmax (@epicmaxco).
https://vuestic.dev
MIT License
3.51k stars 340 forks source link

Nuxt 3.12.2 ignores vuestic.config.ts #4403

Open m0ksem opened 2 weeks ago

m0ksem commented 2 weeks ago

v3.12.1 works fine

Repro: https://stackblitz.com/edit/github-poqjmh?file=package.json,nuxt.config.ts,app.vue

when component used via auto-import it ignores vuestic.config.ts

Although, if component is imported from 'vuestic-ui' via import config is applied correctly.

Looks like nuxt imports from esm-node build when registering global components, instead of es since 3.13.2

may be related to: https://github.com/nuxt/nuxt/pull/28843/files#diff-06cc43bd13b65d1b07374d99f41947196c616c32398339ed40d0a3faa678ad2dR174

Now when nuxt ensures filePath, resolvePath from mlly uses node condition with higher priority.

We could replace component registration with absolute path manually.

  import { resolveSync } from 'mlly'

  const vuesticModulePath = resolveSync('vuestic-ui', {
    conditions: ['import'],
    url: import.meta.url
  })

  importNames.forEach((name) => {
    /**
     * Add component from vuestic-ui package.
     * Nuxt will tree-shake components that not included in options.
     * Nuxt also will add component to auto-import.
     */
    addComponent({
      name,
      export: name,
      filePath: vuesticModulePath
    })
  })
m0ksem commented 2 weeks ago

After resolvePath force added, nuxt loads components from different places:

Initially, I though problem in incorrect condition exports in vuestic package.json (fixed in #4404), but eventually I noticed that import * from 'vuestic-ui' resolves import from vite cache.