\r\n \u003CCreditCard />\r\n \u003CPlaceholderContent class=\"clickable\" />\r\n \u003CTheFooter />\r\n \u003C/div>\r\n \u003CAbout />\r\n \u003C/div>\r\n\u003C/template>\r\n```\r\n\r\n```\r\n// components/PlaceholderHeader.vue\r\n\u003Ctemplate>\r\n \u003Cheader>\r\n \u003CNuxtLink class=\"logo\" to=\"/\">\r\n \u003Cnuxt-img src=\"/assets/img/logo-chrome.png\" alt=\"Content Dot Net\" />\r\n \u003C/NuxtLink >\r\n \u003Cdiv class=\"counter\">\r\n \u003Cdiv>0005312\u003C/div>\r\n \u003C/div>\r\n \u003C/header>\r\n\u003C/template>\r\n```\r\n\r\n```\r\n// components/About.vue\r\n\u003Ctemplate>\r\n \u003Cdiv id=\"about\" class=\"container\">\r\n \u003Cdiv v-if=\"data\">\r\n \u003Cdiv v-for=\"about in data\">\r\n \u003Ch1>{{ about.about[0].children[0].text }}\u003C/h1>\r\n \u003Ch2>\u003Cspan class=\"underline\">{{ about.about[1].children[0].text }}\u003C/span>{{ about.about[1].children[1].text }}\u003C/h2>\r\n \u003Ch3>\u003CNuxtLink href=\"mailto:info@content.net.au\">EMAIL...\u003C/NuxtLink> \u003CNuxtLink to=\"https://instagram.com/content.net.au\">INSTAGRAM...\u003C/NuxtLink> \u003CNuxtLink to=\"https://contentnetau.bandcamp.com/\">BANDCAMP...\u003C/NuxtLink>\u003C/h3>\r\n \u003Cp>{{ about.about[3].children[0].text }}\u003C/p>\r\n \u003Cp>{{ about.about[4].children[0].text }}\u003C/p>\r\n \u003C/div>\r\n \u003C/div>\r\n \u003C/div>\r\n\u003C/template>\r\n\r\n\u003Cscript setup>\r\n // sanity\r\n const query = groq`*[_type == 'about'] {\r\n about[]{\r\n _key,\r\n _type,\r\n children[]{\r\n _key,\r\n _type,\r\n text\r\n }\r\n }}`;\r\n const { data } = useSanityQuery(query);\r\n\u003C/script>\r\n```\r\n\r\n```\r\n// components/CreditCard.vue\r\n\u003Ctemplate>\r\n \u003Cdiv class=\"container\">\r\n \u003Cdiv id=\"credit-card\">\u003C/div>\r\n \u003C/div>\r\n\u003C/template>\r\n```\r\n\r\n```\r\n//components/TheFooter.vue\r\n\u003Ctemplate>\r\n \u003Cfooter>\r\n \u003Cbutton id=\"footer-btn\" class=\"logo\">\r\n \u003Cnuxt-img src=\"/assets/img/logo-c-chrome.png\" alt=\"C\" />\r\n \u003C/button >\r\n \u003Cdiv class=\"copyright\">\r\n \u003Cp>Content Dot Net © 2023\u003C/p>\r\n \u003C/div>\r\n \u003C/footer>\r\n\u003C/template>\r\n```\r\n\r\n```\r\n// plugins/about.js\r\nexport default defineNuxtPlugin(nuxtApp => {\r\n // about footer button interaction\r\n setTimeout(() => {\r\n var footerBtn = document.querySelector('#footer-btn');\r\n var about = document.querySelector('#about');\r\n var main = document.querySelector('#main');\r\n \r\n footerBtn.addEventListener('click', function() {\r\n about.classList.add('open')\r\n main.classList.add('blur')\r\n });\r\n \r\n about.addEventListener('click', function() {\r\n about.classList.remove('open')\r\n main.classList.remove('blur')\r\n });\r\n }, 100)\r\n})\r\n```\r\n\r\n```\r\n// plugins/creditCard.js\r\nexport default defineNuxtPlugin(nuxtApp => {\r\n // prompt: credit card number\r\n setTimeout(() => {\r\n const element = document.getElementById('credit-card')\r\n var creditCard = Number(prompt('Enter credit card number'))\r\n // var validation = /^(?:4[0-9]{12}(?:[0-9]{3})?)$/\r\n\r\n if (creditCard == 0) {\r\n // document.getElementById('credit-card').innerHTML = 'Invalid'\r\n console.log('Invalid')\r\n }\r\n else if (!Number.isNaN(creditCard)) {\r\n element.innerHTML = creditCard + ' 💰'\r\n element.classList.add('valid')\r\n console.log('Credit Card Number: ' + creditCard)\r\n\r\n element.addEventListener('click', function() {\r\n element.classList.add('hide')\r\n })\r\n }\r\n else if (Number.isNaN(creditCard)) {\r\n element.innerHTML = 'Invalid credit card number. Try again'\r\n console.log('N/A')\r\n\r\n element.addEventListener('click', function() {\r\n element.classList.add('hide')\r\n })\r\n }\r\n }, 6000);\r\n })\r\n```\r\n\r\n```\r\n// plugins/message.js\r\nexport default defineNuxtPlugin(nuxtApp => {\r\n // alert: message\r\n setTimeout(function() {\r\n var messageIntro = 'NEW MESSAGE (1) from content.net.au: \\n\\n'\r\n var message1 = messageIntro + 'Welcome to our world! Please click the links to hear our music + watch our videos…if u do i will return the favour…also pls follow us on social media x'\r\n var message2 = messageIntro + 'Lets connect, send me an email info@content.net.au'\r\n var message3 = messageIntro + 'https://drive.google.com/drive/folders/1S3ilSaQCreXwAxNdrvYnEnQKex2NquWH?usp=share_link'\r\n\r\n var messageArray = [message1, message2, message3];\r\n var count = -1;\r\n\r\n var elements = document.getElementsByClassName('clickable');\r\n\r\n for (var i = 0, len = elements.length; i \u003C len; i++) {\r\n elements[i].addEventListener(\"click\", function() {\r\n alert(messageArray[++count % messageArray.length]);\r\n });\r\n }\r\n }, 100);\r\n })\r\n```\r\n\r\n### Logs\r\n\r\nLog via Vercel:\r\n\r\n```\r\nUncaught Exception \t{\"errorType\":\"ReferenceError\",\"errorMessage\":\"document is not defined\",\"stack\":[\"ReferenceError: document is not defined\",\" at Timeout._onTimeout (file:///var/task/chunks/app/server.mjs:875:21)\",\" at listOnTimeout (node:internal/timers:564:17)\",\" at process.processTimers (node:internal/timers:507:7)\"]}\r\nUnknown application error occurred\r\nRuntime.Unknown\r\n```\r\n",[3084,3085],{"name":3035,"color":3036},{"name":3038,"color":3039},20220,"Serverless Function Invocation Failed at Timeout when deploying Nuxt 3 site on Vercel","2023-04-13T03:07:22Z","https://github.com/nuxt/nuxt/issues/20220",0.66498834,{"labels":3092,"number":3095,"owner":3026,"repository":3026,"state":3027,"title":3096,"updated_at":3097,"url":3098,"score":3099},[3093,3094],{"name":3038,"color":3039},{"name":3023,"color":3024},7747,"\"Document is not defined\" with component library extractCss: false","2023-01-22T15:36:04Z","https://github.com/nuxt/nuxt/issues/7747",0.66569614,{"description":3101,"labels":3102,"number":3107,"owner":3026,"repository":3026,"state":3027,"title":3108,"updated_at":3109,"url":3110,"score":3111},"Hello,\r\nI see following error on the server side and then NUXT is shutting down:\r\n\r\n```\r\n/data/vuejs/students-admin/node_modules/vue-meta/lib/vue-meta.js:824\r\n var htmlTag = document.getElementsByTagName('html')[0];\r\n ^\r\n\r\nReferenceError: document is not defined\r\n at updateClientMetaInfo (/data/example-project/node_modules/vue-meta/lib/vue-meta.js:824:19)\r\n at Vue$2.refresh (/data/example-project/node_modules/vue-meta/lib/vue-meta.js:885:35)\r\n at /data/example-project/node_modules/vue-meta/lib/vue-meta.js:1007:74\r\n at Timeout._onTimeout (/data/example-project/node_modules/vue-meta/lib/vue-meta.js:924:5)\r\n at ontimeout (timers.js:365:14)\r\n at tryOnTimeout (timers.js:237:5)\r\n at Timer.listOnTimeout (timers.js:207:5)\r\n```\n\n\u003C!--cmty-->\u003C!--cmty_prevent_hook-->\n\u003Cdiv align=\"right\">\u003Csub>\u003Cem>This question is available on \u003Ca href=\"https://nuxtjs.cmty.io\">Nuxt.js\u003C/a> community (\u003Ca href=\"https://nuxtjs.cmty.io/nuxt/nuxt.js/issues/c390\">#c390\u003C/a>)\u003C/em>\u003C/sub>\u003C/div>",[3103,3106],{"name":3104,"color":3105},"available soon","6de8b0",{"name":3023,"color":3024},449,"bug on nested routes with vue-meta on .10.x release","2023-01-18T22:17:23Z","https://github.com/nuxt/nuxt/issues/449",0.66676617,{"labels":3113,"number":3118,"owner":3026,"repository":3026,"state":3027,"title":3119,"updated_at":3120,"url":3121,"score":3122},[3114,3115],{"name":3035,"color":3036},{"name":3116,"color":3117},"bug","d73a4a",12767,"document.querySelector(...).forEach is not a function","2023-01-19T16:21:24Z","https://github.com/nuxt/nuxt/issues/12767",0.66807353,["Reactive",3124],{},["Set"],["ShallowReactive",3127],{"$fTRc1wZytZ_XrK4EfJfei_Sz-An4H4Yy6syhVxH_PVJc":-1,"$fD1tJQLIex38DkLUg_XZX1Ve8HhYtHk-omuxd-IqFbZ4":-1},"/nuxt/ui/4499"]