0

I have the following problem: there is no issue when I run npm run dev everything works fine. However, when I run npm run build I get the following error:

Console:

[plugin @tailwindcss/vite:generate:build] Sourcemap is likely to be incorrect: a plugin (@tailwindcss/vite:generate:build) was used to transform files, but didn't generate a sourcemap for the transformation. Consult the plugin documentation for help (x8)

✓ built in 6.50s                                                                                   
✔ Server built in 6527ms                                                                             
Initializing prerenderer

WARN  "file:///E:/Github/peterplevko.eu/frontend/node_modules/nuxt/dist/core/runtime/nitro/utils/cache-driver.js" is imported by "virtual:#nitro-internal-virtual/storage", but could not be resolved – treating it as an external dependency.

ERROR  appendHeader is not defined

at /E:/Github/peterplevko.eu/frontend/.nuxt/prerender/chunks/_/nitro.mjs:5484:17
at ModuleJob.run (node:internal/modules/esm/module_job:271:25)
at async onImport.tracePromise.__proto__ (node:internal/modules/esm/loader:547:26)
at async prerender (/E:/Github/peterplevko.eu/frontend/node_modules/nuxt/node_modules/nitropack/dist/core/index.mjs:2034:44)
at async /E:/Github/peterplevko.eu/frontend/node_modules/nuxt/dist/shared/nuxt.CJ7ZnOUY.mjs:4671:5
at async build (/E:/Github/peterplevko.eu/frontend/node_modules/nuxt/dist/shared/nuxt.CJ7ZnOUY.mjs:7278:3)  
at async Object.run (/E:/Github/peterplevko.eu/frontend/node_modules/@nuxt/cli/dist/chunks/build.mjs:76:5)  
at async runCommand (/E:/Github/peterplevko.eu/frontend/node_modules/citty/dist/index.mjs:316:16)
at async runCommand (/E:/Github/peterplevko.eu/frontend/node_modules/citty/dist/index.mjs:307:11)
at async runMain (/E:/Github/peterplevko.eu/frontend/node_modules/citty/dist/index.mjs:445:7)

ERROR  appendHeader is not defined 

Image:

error

Here is my package.json

{
  "name": "nuxt-app",
  "private": true,
  "type": "module",
  "scripts": {
    "build": "nuxt build",
    "dev": "nuxt dev",
    "generate": "nuxt generate",
    "preview": "nuxt preview"
  },
  "dependencies": {
    "@heroicons/vue": "^2.2.0",
    "@nuxt/content": "^3.6.3",
    "@nuxt/image-edge": "^1.3.0-28493895.369b747",
    "@nuxtjs/seo": "^3.0.3",
    "@supabase/supabase-js": "^2.49.8",
    "@tmcw/togeojson": "^7.1.2",
    "@vueuse/core": "^13.3.0",
    "ajv": "^8.17.1",
    "better-sqlite3": "^12.2.0",
    "daisyui": "^5.0.37",
    "dayjs": "^1.11.13",
    "leaflet": "^1.9.4",
    "nitropack": "^2.8.1",
    "nuxt": "^3.17.7",
    "simplify-geojson": "^1.0.5",
    "vue": "^3.5.14",
    "vue-router": "^4.5.1"
  },
  "devDependencies": {
    "@nuxt/eslint": "^1.4.1",
    "@nuxtjs/tailwindcss": "^7.0.0-beta.0",
    "autoprefixer": "^10.4.21",
    "eslint": "^9.31.0",
    "postcss": "^8.5.3"
  }
}

Here is my nuxt.config.ts:

// https://nuxt.com/docs/api/configuration/nuxt-config
export default defineNuxtConfig({
  compatibilityDate: '2025-05-15',
  devtools: { enabled: true },
  modules: [
    '@nuxtjs/tailwindcss',
    '@nuxt/eslint',
    '@nuxt/image-edge',
    'daisyui',
    '@nuxtjs/seo',
    '@nuxt/content'
  ],
  app: {
    head: {
      link: [
        { rel: 'icon', type: 'image/x-icon', href: '/favicon.ico' }
      ]
    }
  },
  runtimeConfig: {
    public: {
      supabaseUrl: process.env.SUPABASE_URL,
      supabaseAnonKey: process.env.SUPABASE_ANON_KEY
    }
  },

  site: {
    url: 'https://www.peterplevko.eu',
    name: 'Peter Plevko',
    description: 'Cyklotrasy Bratislava - Najkrajšie cyklovýlety z Bratislavy. GPS súbory, fotky a podrobné popisy trás.',
    defaultLocale: 'sk',
    keywords: 'cyklotrasy Bratislava, cyklotrasa Bratislava, bicykel Bratislava, cyklovýlet Bratislava, cyklotrasy okolo Bratislavy, cyklocesty Bratislava, cyklistika Bratislava, blogs, sports, bratislava, trips, slovakia, bicycle, hiking, running, climbing',
  },
  sitemap: {
    enabled: true,
    xsl: false,
    sources: ['/api/sitemap/urls'],
  },
  nitro: {
    prerender: {
      crawlLinks: true,
      failOnError: false,
      autoSubfolderIndex: false,
    },
  },
  robots: {
    enabled: true,
    allow: ['/'],
    sitemap: '/sitemap.xml',
    metaTag: true,
},
  routeRules: {
    '/': {
      static: true,
      prerender: true,
    },
    '/bicycle/**': {
      static: true,
      prerender: true,
    },
    '/about': {
      static: true,
      prerender: true,
    },
    '/climbing': {
      static: true,
      prerender: true,
    },
    '/hiking': {
      static: true,
      prerender: true,
    },
    '/running': {
      static: true,
      prerender: true,
    },
    '/support': {
      static: true,
      prerender: true,
    },
    // Redirect rules for SEO
    'http://peterplevko.eu/**': {
      redirect: {
        to: 'https://www.peterplevko.eu$1',
        statusCode: 301
      }
    },
    'https://peterplevko.eu/**': {
      redirect: {
        to: 'https://www.peterplevko.eu$1',
        statusCode: 301
      }
    },
    'http://www.peterplevko.eu/**': {
      redirect: {
        to: 'https://www.peterplevko.eu$1',
        statusCode: 301
      }
    },
  },
})

Node version: v22.12.0

The problem appeared after I added map functionality to my website using Leaflet, but I have no idea why it's happening or how to fix it. I would really appreciate any help. Thanks in advance.

I fixed the problem myself just now the problem was this file frontend/server/api/routes.ts. After I removed it the build works.

export default defineEventHandler(async (event) => {
  try {
    const { queryCollection } = await import('#imports')
    const [bicycleArticles, runningArticles] = await Promise.all([
      queryCollection(event, 'bicycle').all(),
      queryCollection(event, 'running').all()
    ])
    const allArticles = [...bicycleArticles, ...runningArticles]

    const routesWithGeoJSON = await Promise.all(
      allArticles
        .filter(article => article.geojsonUrl)
        .map(async (article) => {
          let geojson = null
          if (article.geojsonUrl) {
            try {
              const response = await fetch(article.geojsonUrl)
              if (response.ok) {
                geojson = await response.json()
              }
            } catch (e) {
              console.error('Error fetching geojson:', e)
            }
          }
          return {
            ...article,
            geojsonUrl: article.geojsonUrl,
            geojson
          }
        })
    )

    return {
      success: true,
      routes: routesWithGeoJSON,
      total: routesWithGeoJSON.length,
      method: 'geojson-url-bundle'
    }
  } catch (error) {
    console.error('Error fetching routes:', error)
    return {
      success: false,
      error: error instanceof Error ? error.message : 'Unknown error',
      routes: []
    }
  }
}) 

0

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service and acknowledge you have read our privacy policy.

Start asking to get answers

Find the answer to your question by asking.

Ask question

Explore related questions

See similar questions with these tags.