@peterbud/nuxt-query/dist/module.mjs

Nuxt integration for Tanstack Query

import { createResolver, defineNuxtModule, addPlugin, addImports } from '@nuxt/kit';
import { defu } from 'defu';
import { existsSync } from 'node:fs';
import { addCustomTab } from '@nuxt/devtools-kit';

const version = "1.0.0";

const DEVTOOLS_UI_ROUTE = "/__nuxt-query-client";
const DEVTOOLS_UI_LOCAL_PORT = 3300;
function setupDevToolsUI(nuxt, resolver) {
  const clientPath = resolver.resolve("./client");
  const isProductionBuild = existsSync(clientPath);
  if (isProductionBuild) {
    nuxt.hook("vite:serverCreated", async (server) => {
      const sirv = await import('sirv').then((r) => r.default || r);
      server.middlewares.use(
        DEVTOOLS_UI_ROUTE,
        sirv(clientPath, { dev: true, single: true })
      );
    });
  } else {
    nuxt.hook("vite:extendConfig", (config) => {
      config.server = config.server || {};
      config.server.proxy = config.server.proxy || {};
      config.server.proxy[DEVTOOLS_UI_ROUTE] = {
        target: `http://localhost:${DEVTOOLS_UI_LOCAL_PORT}${DEVTOOLS_UI_ROUTE}`,
        changeOrigin: true,
        followRedirects: true,
        rewrite: (path) => path.replace(DEVTOOLS_UI_ROUTE, "")
      };
    });
  }
  addCustomTab({
    name: "nuxt-query",
    title: "Nuxt Query",
    icon: "carbon:palm-tree",
    view: {
      type: "iframe",
      src: `${DEVTOOLS_UI_ROUTE}/vue-query`
    }
  });
}

const _composables = [
  "useQuery",
  "useQueries",
  "useInfiniteQuery",
  "useMutation",
  "useIsFetching",
  "useIsMutating",
  "useQueryClient"
];
const resolver = createResolver(import.meta.url);
const module = defineNuxtModule({
  meta: {
    name: "nuxt-query",
    configKey: "nuxtQuery",
    version
  },
  // Default configuration options of the Nuxt module
  defaults: {
    autoImports: false,
    devtools: true
  },
  setup(options, nuxt) {
    nuxt.options.runtimeConfig.public.nuxtQuery = defu(
      nuxt.options.runtimeConfig.public.nuxtQuery,
      {
        queryClientOptions: { ...options.queryClientOptions }
      }
    );
    addPlugin(resolver.resolve("./runtime/plugin"));
    let importComposables = new Set(_composables);
    if (typeof options.autoImports === "boolean") {
      !options.autoImports && importComposables.clear();
    } else {
      importComposables = new Set(options.autoImports);
    }
    addImports([...importComposables.values()].map((name) => ({ name, from: "@tanstack/vue-query" })));
    if (options.devtools)
      setupDevToolsUI(nuxt, resolver);
  }
});

export { module as default };