ui icon indicating copy to clipboard operation
ui copied to clipboard

Re-export types of subdependencies

Open UfukUstali opened this issue 6 months ago • 0 comments

Description

Now that nuxt by default doesn't enable shamefully-hoist we cannot import from tailwind directly because it is a subdependancy of @nuxt/ui.

import type { Config } from "tailwindcss";

// - or -

/** @type {import('tailwindcss').Config} */

So this gives Cannot find module 'tailwindcss' or its corresponding type declarations. error. This means that we get no typesafety in our tailwind.config.[ts|js] files.

Documentation specifically 3.theming.md would also need to be updated to reflect these changes.

The same issue also effects the icon, colorMode and tailwindcss keys in the nuxt.config.ts.

export default defineNuxtConfig({
  compatibilityDate: "2024-04-03",
  devtools: { enabled: true },
  modules: ["@nuxt/ui"],
  ui: {},
  icon: {}, // <- typed any
});

.nuxt/types/schema.d.ts file is the file that defines the types for the nuxt.config.ts and because it is a part of our project. The imports from the individual subdependency modules like @nuxt/icon are broken.

// .nuxt/types/schema.d.ts
interface NuxtConfig {
    ["icon"]?: typeof import("@nuxt/icon").default extends NuxtModule<infer O> ? Partial<O> : Record<string, any>,    .....
                                            // ^? any
}

If it is the case that we cannot manipulate the output of schema.d.ts file to import the re-exported types rather than the original ones we can add a type template that would import and declare the default export of the respective module like this

import type { ReExportedIconModuleType } from "@nuxt/ui/types"
declare module "@nuxt/icon" {
  export default ReExportedIconModuleType;
}

Additional context

No response

UfukUstali avatar Aug 10 '24 21:08 UfukUstali