fix: drop #imports usage

Fixes #288

Author: harlan-zw

src/runtime/components/ScriptPayPalButtons.vue

@@ -14,7 +14,9 @@ import type {
   PayPalButtonsComponentOptions,
   OnInitActions,
 } from '@paypal/paypal-js'
-import { onBeforeUnmount, resolveComponent, useScriptPayPal, useScriptTriggerElement } from '#imports'
+import { useScriptPayPal } from '../registry/paypal'
+import { useScriptTriggerElement } from '../composables/useScriptTriggerElement'
+import { onBeforeUnmount, resolveComponent } from 'vue'
 import type { ElementScriptTrigger } from '#nuxt-scripts/types'
 import type { PayPalInput } from '../registry/paypal'
 

src/runtime/components/ScriptPayPalMarks.vue

@@ -2,7 +2,9 @@
 import { computed, type HTMLAttributes, onMounted, ref, type ReservedProps, shallowRef, watch } from 'vue'
 import { defu } from 'defu'
 import type { PayPalMarksComponent, PayPalMarksComponentOptions } from '@paypal/paypal-js'
-import { onBeforeUnmount, resolveComponent, useScriptPayPal, useScriptTriggerElement } from '#imports'
+import { useScriptPayPal } from '../registry/paypal'
+import { useScriptTriggerElement } from '../composables/useScriptTriggerElement'
+import { onBeforeUnmount, resolveComponent } from 'vue'
 import type { ElementScriptTrigger } from '#nuxt-scripts/types'
 import type { PayPalInput } from '../registry/paypal'
 

src/runtime/components/ScriptPayPalMessages.vue

@@ -2,7 +2,9 @@
 import { computed, type HTMLAttributes, onMounted, ref, type ReservedProps, shallowRef, watch } from 'vue'
 import { defu } from 'defu'
 import type { PayPalMessagesComponent, PayPalMessagesComponentOptions } from '@paypal/paypal-js'
-import { onBeforeUnmount, resolveComponent, useScriptPayPal, useScriptTriggerElement } from '#imports'
+import { useScriptPayPal } from '../registry/paypal'
+import { useScriptTriggerElement } from '../composables/useScriptTriggerElement'
+import { onBeforeUnmount, resolveComponent } from 'vue'
 import type { ElementScriptTrigger } from '#nuxt-scripts/types'
 import type { PayPalInput } from '../registry/paypal'
 

src/runtime/components/ScriptStripePricingTable.vue

@@ -2,7 +2,7 @@
 import { ref, computed, onBeforeUnmount, onMounted, watch } from 'vue'
 import type { ElementScriptTrigger } from '../types'
 import { useScriptTriggerElement } from '../composables/useScriptTriggerElement'
-import { useScript } from '#imports'
+import { useScript } from '../composables/useScript'
 
 const props = withDefaults(defineProps<{
   trigger?: ElementScriptTrigger

src/runtime/composables/useScript.ts

@@ -3,7 +3,7 @@ import { defu } from 'defu'
 import { useScript as _useScript } from '@unhead/vue/scripts'
 import { reactive } from 'vue'
 import type { NuxtDevToolsScriptInstance, NuxtUseScriptOptions, UseFunctionType, UseScriptContext } from '../types'
-import { onNuxtReady, useNuxtApp, useRuntimeConfig, injectHead } from '#imports'
+import { onNuxtReady, useNuxtApp, useRuntimeConfig, injectHead } from 'nuxt/app'
 import { logger } from '../logger'
 
 function useNuxtScriptRuntimeConfig() {

src/templates.ts

@@ -2,21 +2,26 @@ import { hash } from 'ohash'
 import type { ModuleOptions } from './module'
 import { logger } from './logger'
 import type { RegistryScript } from '#nuxt-scripts/types'
+import {useNuxt} from "@nuxt/kit";
+import {relative} from "pathe";
 
 export function templatePlugin(config: Partial<ModuleOptions>, registry: Required<RegistryScript>[]) {
   if (Array.isArray(config.globals)) {
     // convert to object
     config.globals = Object.fromEntries(config.globals.map(i => [hash(i), i]))
     logger.warn('The `globals` array option is deprecated, please convert to an object.')
   }
-  const imports = ['useScript', 'defineNuxtPlugin']
+  const nuxt = useNuxt()
+  const buildDir = nuxt.options.buildDir
+  const imports = []
   const inits = []
   // for global scripts, we can initialise them script away
   for (const [k, c] of Object.entries(config.registry || {})) {
     const importDefinition = registry.find(i => i.import.name === `useScript${k.substring(0, 1).toUpperCase() + k.substring(1)}`)
     if (importDefinition) {
       // title case
-      imports.unshift(importDefinition.import.name)
+      imports.unshift(`import { ${importDefinition.import.name} } from '${relative(buildDir, importDefinition.import.from)}'`)
+      console.log(`import { ${importDefinition.import.name} } from '${relative(buildDir, importDefinition.import.from)}'`)
       const args = (typeof c !== 'object' ? {} : c) || {}
       if (c === 'mock')
         args.scriptOptions = { trigger: 'manual', skipValidation: true }
@@ -35,7 +40,9 @@ export function templatePlugin(config: Partial<ModuleOptions>, registry: Require
     }
   }
   return [
-    `import { ${imports.join(', ')} } from '#imports'`,
+    `import { useScript } from '#nuxt-scripts/composables/useScript'`,
+    `import { defineNuxtPlugin } from 'nuxt/app'`,
+    ...imports,
     '',
     `export default defineNuxtPlugin({`,
     `  name: "scripts:init",`,