kb
kb
Explore posts from servers
NNuxt
Created by kb on 11/11/2024 in #❓・help
useAsyncData/useFetch > Function > Pinia Action - Best practices?
Hey folks, looking for some advice. I currently have something like this
const { error } = useAsyncData('details', async () => {
if (isSelected.value) return details.value

await fetchdetails()

return details.value
})
const { error } = useAsyncData('details', async () => {
if (isSelected.value) return details.value

await fetchdetails()

return details.value
})
so I already think im using it weird, but then that fetchDetails is in the component, and it has some logic on building a payload, which ultimately then fires off a pinia action, and then our pinia action, uses useFetchApi (which is a composable of $fetch) - so were now at like 4 levels of execution lol, it just feels a bit icky. Im just wondering what the best practices here might be, like the useAsyncData at the top, would that be advised/not advised given the scenario ive explained?
7 replies
NNuxt
Created by kb on 11/8/2024 in #❓・help
Nuxt OG Image works locally but not deployed
Hey, I can see my og image locally in the dev tools, but it is not doing it when deploying. Is it because it doesnt put the image in public folder but instead https://x.vercel.app/__og-image__/image/stores/x-test-store-3733/og.png I am currently trying a local build & serve
10 replies
NNuxt
Created by kb on 11/7/2024 in #❓・help
NuxtImg + Vercel
Im using NuxtImg on Vercel, but I cannot figure out what I need to put in the nuxt.config.js because the docs say im supposed to supply every custom width? (https://image.nuxt.com/providers/vercel) I am running vuetify, and tailwind, if this helps. But as far as sizes, in the given component, im rendering out a few images, with unique sizes per, where im passing this; into my NuxtImg, sizes (in a loop)
[
{
"src": "/home-bg/home-bg-top-1.webp",
"class": "home-bg-top-1",
"sizes": "xs:56px sm:104px md:88px lg:120px xl:136px",
"key": "home-bg-top-1"
},
{
"src": "/home-bg/home-bg-top-2.webp",
"class": "home-bg-top-2",
"sizes": "xs:66px sm:114px md:98px lg:130px xl:146px",
"key": "home-bg-top-2"
},
{
"src": "/home-bg/home-bg-top-3.webp",
"class": "home-bg-top-3",
"sizes": "xs:130px sm:146px md:146px lg:226px xl:226px",
"key": "home-bg-top-3"
},
{
"src": "/home-bg/home-bg-top-4.webp",
"class": "home-bg-top-4",
"sizes": "xs:62px sm:78px md:94px lg:110px xl:126px",
"key": "home-bg-top-4"
},
{
"src": "/home-bg/home-bg-bottom-1.webp",
"class": "home-bg-bottom-1",
"sizes": "xs:100px sm:164px md:148px lg:225px xl:180px",
"key": "home-bg-bottom-1"
},
{
"src": "/home-bg/home-bg-bottom-2.webp",
"class": "home-bg-bottom-2",
"sizes": "xs:70px sm:94px md:94px lg:110px xl:110px",
"key": "home-bg-bottom-2"
},
{
"src": "/home-bg/home-bg-bottom-3.webp",
"class": "home-bg-bottom-3",
"sizes": "xs:131px sm:179px md:163px lg:179px xl:227px",
"key": "home-bg-bottom-3"
}
]
[
{
"src": "/home-bg/home-bg-top-1.webp",
"class": "home-bg-top-1",
"sizes": "xs:56px sm:104px md:88px lg:120px xl:136px",
"key": "home-bg-top-1"
},
{
"src": "/home-bg/home-bg-top-2.webp",
"class": "home-bg-top-2",
"sizes": "xs:66px sm:114px md:98px lg:130px xl:146px",
"key": "home-bg-top-2"
},
{
"src": "/home-bg/home-bg-top-3.webp",
"class": "home-bg-top-3",
"sizes": "xs:130px sm:146px md:146px lg:226px xl:226px",
"key": "home-bg-top-3"
},
{
"src": "/home-bg/home-bg-top-4.webp",
"class": "home-bg-top-4",
"sizes": "xs:62px sm:78px md:94px lg:110px xl:126px",
"key": "home-bg-top-4"
},
{
"src": "/home-bg/home-bg-bottom-1.webp",
"class": "home-bg-bottom-1",
"sizes": "xs:100px sm:164px md:148px lg:225px xl:180px",
"key": "home-bg-bottom-1"
},
{
"src": "/home-bg/home-bg-bottom-2.webp",
"class": "home-bg-bottom-2",
"sizes": "xs:70px sm:94px md:94px lg:110px xl:110px",
"key": "home-bg-bottom-2"
},
{
"src": "/home-bg/home-bg-bottom-3.webp",
"class": "home-bg-bottom-3",
"sizes": "xs:131px sm:179px md:163px lg:179px xl:227px",
"key": "home-bg-bottom-3"
}
]
So what exactly does my nuxt config want me to put, for it to work on vercel? thx!!
11 replies
NNuxt
Created by kb on 11/5/2024 in #❓・help
Nuxt 3 SSR Vercel Deployment Issues
No description
14 replies
NNuxt
Created by kb on 10/28/2024 in #❓・help
Lint complaining about await in setup function
No description
7 replies
NNuxt
Created by kb on 10/9/2024 in #❓・help
N2 > 3 server middleware issue
Hey, Im trying to transplant some functionality from a nuxt2 project, where we had ~/server_middleware/authauth.js which has some imports in like
import { AVAILABLE_STRATEGIES, AVAILABLE_METHODS } from '../constants/auth'
import {
ERROR_AUTHAUTH_SERVER_MIDDLEWARE_BAD_REQUEST,
ERROR_AUTHAUTH_SERVER_MIDDLEWARE_UNKNOWN_REQUEST,
ERROR_AUTHAUTH_SERVER_MIDDLEWARE_STRATEGY_AUTHENTICATION_ERROR,
} from '../constants/errors'
import { getStrategyCredentials, getStrategyEndpoint } from '../utils/authCredentials'
import { AVAILABLE_STRATEGIES, AVAILABLE_METHODS } from '../constants/auth'
import {
ERROR_AUTHAUTH_SERVER_MIDDLEWARE_BAD_REQUEST,
ERROR_AUTHAUTH_SERVER_MIDDLEWARE_UNKNOWN_REQUEST,
ERROR_AUTHAUTH_SERVER_MIDDLEWARE_STRATEGY_AUTHENTICATION_ERROR,
} from '../constants/errors'
import { getStrategyCredentials, getStrategyEndpoint } from '../utils/authCredentials'
so now in nuxt3, I have made ~\server\api\authauth.post.js which i think is right? and those same imports with updated pathing like import { getStrategyCredentials, getStrategyEndpoint } from '../../utils/authCredentials' but I get [15:14:52] ERROR [worker reload] [worker init] Cannot find module 'C:\Users\constants\auth' imported from C:\Users\myuser\Repos\myrepo\.nuxt\dev\index.mjs any ideas?
3 replies
NNuxt
Created by kb on 9/3/2024 in #❓・help
Nuxt Icon - Custom Local Collection - Change Colour?
As title - can you not change the colour of a SVG that is part of a custom local collection?
4 replies
NNuxt
Created by kb on 7/23/2024 in #❓・help
Make Nuxt Icon <Icon> a global component?
Hi, we are using nuxt 3, and im using the NuxtIcon module https://nuxt.com/modules/icon - but right now we dont have our components auto importing, so i wondered how can I make it so I dont need to do import { Icon } from '#components' in every component?
4 replies
RRailway
Created by kb on 5/15/2024 in #✋|help
Occasional Build Failures
Is something going on currently? I'd been running great for days and now getting a lot of
=========================

Container failed to start

=========================



activity StartToClose timeout
=========================

Container failed to start

=========================



activity StartToClose timeout
/service/85702912-9462-4f78-ab6a-06d10c35e865?id=f74c32d6-2292-47ec-9bb1-0fa7d1267ba8 just curious :-) - my project uses the cron scheduling to rebuild every 15m i believe
6 replies
NNuxt
Created by kb on 4/16/2024 in #❓・help
How to use plugins in latest nuxt/eslint module?
As title basically, how do I use all my plugins & prettier etc when migrating to the newest eslint integration method?
1 replies
NNuxt
Created by kb on 4/9/2024 in #❓・help
404 after error
No description
1 replies
RRailway
Created by kb on 3/25/2024 in #✋|help
Using Cron instead of scheduling in code
Im using node-schedule to do the following in my code;
schedule.scheduleJob("*/15 * * * *", async () => {
await runStuff()
});
schedule.scheduleJob("*/15 * * * *", async () => {
await runStuff()
});
but just noticed the Cron Schedule on railway settings, could I do away with the scheduler-in-code stuff with this, and just my code self executes runStuff() - or am i misunderstanding the cron stuff on railways side of things
8 replies
NNuxt
Created by kb on 3/21/2024 in #❓・help
Removing a cookie
Hey, is this definitely the best way to remove a cookie? I am trying to replace cookiz library with native useCookie
const registerStepValidatedCookie = useCookie('registerStepValidated')
registerStepValidatedCookie.value = null
const registerStepValidatedCookie = useCookie('registerStepValidated')
registerStepValidatedCookie.value = null
1 replies
NNuxt
Created by kb on 3/8/2024 in #❓・help
failed to resolve component
have just followed this pretty much verbatim: https://levelup.gitconnected.com/using-fontawesome-icons-with-nuxt-3-e390bd15c0fb but im getting
[Vue warn]: Failed to resolve component: FontAwesomeIcon
If this is a native custom element, make sure to exclude it from component resolution via compilerOptions.isCustomElement.
[Vue warn]: Failed to resolve component: FontAwesomeIcon
If this is a native custom element, make sure to exclude it from component resolution via compilerOptions.isCustomElement.
im using nuxt 3 and haven't imported this component explicitly
4 replies
CDCloudflare Developers
Created by kb on 11/21/2023 in #pages-help
Nuxt Project Wont Publish
Howdy, ive got a nuxt 2.17 project that works fine locally, running node 18.18.2 (which I have as a CF node env) - but I just cant get past this issue
01:09:54.512 ➤ YN0002: │ ss-quiz@workspace:. doesn't provide vue-template-compiler (p7ea12), requested by @vue/test-utils
01:09:54.512 ➤ YN0002: │ ss-quiz@workspace:. doesn't provide vuex (p4600f), requested by vuex-module-decorators
01:09:54.512 ➤ YN0000: │ Some peer dependencies are incorrectly met; run yarn explain peer-requirements <hash> for details, where <hash> is the six-letter p-prefixed code
01:09:54.514 ➤ YN0000: └ Completed in 10s 575ms
01:09:54.617 ➤ YN0000: ┌ Post-resolution validation
01:09:54.618 ➤ YN0028: │ The lockfile would have been modified by this install, which is explicitly forbidden.
01:09:54.619 ➤ YN0000: └ Completed
01:09:54.619 ➤ YN0000: Failed with errors in 10s 682ms
01:09:54.670 Error: Exit with error code: 1
01:09:54.670 at ChildProcess.<anonymous> (/snapshot/dist/run-build.js)
01:09:54.670 at Object.onceWrapper (node:events:652:26)
01:09:54.671 at ChildProcess.emit (node:events:537:28)
01:09:54.671 at ChildProcess._handle.onexit (node:internal/child_process:291:12)
01:09:54.679 Failed: build command exited with code: 1
01:09:55.700 Failed: error occurred while running build command
01:09:54.512 ➤ YN0002: │ ss-quiz@workspace:. doesn't provide vue-template-compiler (p7ea12), requested by @vue/test-utils
01:09:54.512 ➤ YN0002: │ ss-quiz@workspace:. doesn't provide vuex (p4600f), requested by vuex-module-decorators
01:09:54.512 ➤ YN0000: │ Some peer dependencies are incorrectly met; run yarn explain peer-requirements <hash> for details, where <hash> is the six-letter p-prefixed code
01:09:54.514 ➤ YN0000: └ Completed in 10s 575ms
01:09:54.617 ➤ YN0000: ┌ Post-resolution validation
01:09:54.618 ➤ YN0028: │ The lockfile would have been modified by this install, which is explicitly forbidden.
01:09:54.619 ➤ YN0000: └ Completed
01:09:54.619 ➤ YN0000: Failed with errors in 10s 682ms
01:09:54.670 Error: Exit with error code: 1
01:09:54.670 at ChildProcess.<anonymous> (/snapshot/dist/run-build.js)
01:09:54.670 at Object.onceWrapper (node:events:652:26)
01:09:54.671 at ChildProcess.emit (node:events:537:28)
01:09:54.671 at ChildProcess._handle.onexit (node:internal/child_process:291:12)
01:09:54.679 Failed: build command exited with code: 1
01:09:55.700 Failed: error occurred while running build command
I have a yarn.lock file there, and have tried all sorts of build commands, yarn build yarn generate I just can't understand whats wrong, even from that log.
2 replies