fix: replace other locations of custom import name

Author: danielroe

packages/kit/src/internal/template.ts

@@ -1,9 +1,6 @@
 import { promises as fsp } from 'node:fs'
 import lodashTemplate from 'lodash.template'
-import hash from 'hash-sum'
-import { camelCase } from 'scule'
-import { basename, extname } from 'pathe'
-import { genDynamicImport, genImport } from 'knitwork'
+import { genSafeVariableName, genDynamicImport, genImport } from 'knitwork'
 
 import type { NuxtTemplate } from '@nuxt/schema'
 
@@ -26,18 +23,16 @@ export async function compileTemplate (template: NuxtTemplate, ctx: any) {
 
 const serialize = (data: any) => JSON.stringify(data, null, 2).replace(/"{(.+)}"(?=,?$)/gm, r => JSON.parse(r).replace(/^{(.*)}$/, '$1'))
 
-const importName = (src: string) => `${camelCase(basename(src, extname(src))).replace(/[^a-zA-Z?\d\s:]/g, '')}_${hash(src)}`
-
 const importSources = (sources: string | string[], { lazy = false } = {}) => {
   if (!Array.isArray(sources)) {
     sources = [sources]
   }
   return sources.map((src) => {
     if (lazy) {
-      return `const ${importName(src)} = ${genDynamicImport(src, { comment: `webpackChunkName: ${JSON.stringify(src)}` })}`
+      return `const ${genSafeVariableName(src)} = ${genDynamicImport(src, { comment: `webpackChunkName: ${JSON.stringify(src)}` })}`
     }
-    return genImport(src, importName(src))
+    return genImport(src, genSafeVariableName(src))
   }).join('\n')
 }
 
-export const templateUtils = { serialize, importName, importSources }
+export const templateUtils = { serialize, importName: genSafeVariableName, importSources }

packages/nuxt/src/core/templates.ts

@@ -1,6 +1,6 @@
 import { templateUtils } from '@nuxt/kit'
 import type { Nuxt, NuxtApp, NuxtTemplate } from '@nuxt/schema'
-import { genArrayFromRaw, genDynamicImport, genExport, genImport, genObjectFromRawEntries, genString } from 'knitwork'
+import { genArrayFromRaw, genDynamicImport, genExport, genImport, genObjectFromRawEntries, genString, genSafeVariableName } from 'knitwork'
 
 import { isAbsolute, join, relative } from 'pathe'
 import { resolveSchema, generateTypes } from 'untyped'
@@ -50,7 +50,7 @@ export const clientPluginTemplate = {
     const clientPlugins = ctx.app.plugins.filter(p => !p.mode || p.mode !== 'server')
     return [
       templateUtils.importSources(clientPlugins.map(p => p.src)),
-      `export default ${genArrayFromRaw(clientPlugins.map(p => templateUtils.importName(p.src)))}`
+      `export default ${genArrayFromRaw(clientPlugins.map(p => genSafeVariableName(p.src)))}`
     ].join('\n')
   }
 }
@@ -64,7 +64,7 @@ export const serverPluginTemplate = {
       templateUtils.importSources(serverPlugins.map(p => p.src)),
       `export default ${genArrayFromRaw([
         'preload',
-        ...serverPlugins.map(p => templateUtils.importName(p.src))
+        ...serverPlugins.map(p => genSafeVariableName(p.src))
       ])}`
     ].join('\n')
   }