Bundle utility functions with the nuxt module build and use bundled f…

…unctions directly

This is a tradeoff between using the usemods package through npm or using source code directly to import the utility functions into Nuxt.
This version copies the bundled utilities into the build process for the module and then references the bundled functions directly. It's a less elegant solution but solves for optimises for local development where changes are made to the base utility and needs fast rebuild of the module to use the new src.

Attempted to use npm link but had numerous issues.

build.mjs

@@ -1,5 +1,6 @@
 import dts from 'bun-plugin-dts'
-import { watch } from 'fs'
+import { watch, mkdir, readFileSync, writeFileSync, copyFileSync } from 'fs'
+import { join } from 'path'
 import { processDocs } from './docs.ts'
 
 async function build() {
@@ -19,6 +20,7 @@ async function build() {
 // Check for --watch flag and if it's not present, just build once
 if (!process.argv.includes('--watch')) {
   await build()
+  await copyBuildFileToNuxtModules()
   await processDocs()
   process.exit(0)
 } else {
@@ -27,6 +29,7 @@ if (!process.argv.includes('--watch')) {
     if (filename.endsWith('.ts')) {
       console.log(`Detected ${event} in ${filename}`)
       await build()
+      await copyBuildFileToNuxtModules()
       await processDocs()
     }
   })
@@ -37,3 +40,15 @@ if (!process.argv.includes('--watch')) {
     process.exit(0)
   })
 }
+
+async function copyBuildFileToNuxtModules() {
+  mkdir('nuxt-module/src/runtime/utils', { recursive: true }, (err) => {
+    if (err) throw err
+  })
+
+  const utils = readFileSync(join(process.cwd(), 'dist/index.js'), 'utf8')
+  const utilsTypeDefinitions = readFileSync(join(process.cwd(), 'dist/index.d.ts'), 'utf8')
+
+  writeFileSync(join(process.cwd(), 'nuxt-module/src/runtime/utils/index.js'), utils)
+  writeFileSync(join(process.cwd(), 'nuxt-module/src/runtime/utils/index.d.ts'), utilsTypeDefinitions)
+}

nuxt-module/package.json

@@ -32,8 +32,7 @@
     "test:watch": "vitest watch"
   },
   "dependencies": {
-    "@nuxt/kit": "^3.10.3",
-    "usemods": "^0.0.11"
+    "@nuxt/kit": "^3.10.3"
   },
   "devDependencies": {
     "@nuxt/devtools": "latest",

nuxt-module/src/module.ts

@@ -1,7 +1,6 @@
-import { defineNuxtModule, addPlugin, createResolver, addImports, addImportsSources } from '@nuxt/kit'
-import * as utils from 'usemods'
+import { defineNuxtModule, createResolver, addPlugin, addImportsDir, addImports } from '@nuxt/kit'
+import * as utils from './runtime/utils'
 
-// Module options TypeScript interface definition
 export interface ModuleOptions {
   alias: [string, string][]
 }
@@ -20,20 +19,16 @@ export default defineNuxtModule<ModuleOptions>({
 
     const aliasMap = new Map<string, string>(options.alias)
 
-    const imports = []
     for (const name of Object.keys(utils)) {
       const alias = aliasMap.has(name) ? aliasMap.get(name!) : name
-      imports.push({
-        name,
-        alias
+      addImports({
+        name: name,
+        as: alias,
+        from: resolve('./runtime/utils')
       })
     }
 
-    addImportsSources({
-      from: 'usemods',
-      imports
-    })
-
+    // addImportsDir(resolve('./runtime/utils'))
     addPlugin(resolve('./runtime/plugin'))
   }
 })

nuxt-module/src/runtime/plugin.ts

@@ -1,5 +1,5 @@
 import { defineNuxtPlugin } from '#app'
 
 export default defineNuxtPlugin((nuxtApp) => {
-  // console.log("mods injected by use-mods!")
+  console.log('mods injected by use-mods!')
 })