Wszystko

Wszystkie

Archiwum

terror_blade
terror_blade
  • 0
Uczę się nuxt 3 i robię sobie małą apkę. Wiem, że w folderze 'pages' mam strukturę urla aplikacji.
Mam takie pytanie, jak mam duży komponent np. products to tworzę wielką kobyłę jednoplikową w pages/products.vue czy rozbijam to na mniejsze i wrzucam do np. components/page/products/header.vue; components/page/products/content.vue; components/page/products/product.vue.
Co myślicie? Jak wy to robicie? ( ͡° ͜ʖ ͡°)

#programowanie #vuejs #nuxt
LaylaTichy
LaylaTichy
  • 1
@terror_blade: w wiekszych projektach group by feature, robie osobny folder pod konkretny ficzr

https://github.com/alan2207/bulletproof-react

w components trzymam rzeczy globalne pod ui, jak logo, header, jakies buttony

wiec na twoim przykladzie zrobilbym folder

features/products/components
features/products/store

etc

no ale jak ci wygodnie, group by feature duzo wygodniejsze w większych projektach

edit: ogolnie jeszcez dodam, ze no starasz sie unikac duzych komponentow, rozbijasz na jak najmn iejsze, oczywiscie, nie ma co przesadzac i rozbijac
Cersin
Cersin
  • 0
Cześć,
wie ktoś jak wyrzucić aplikację nuxt 3 na mydevilnet?
nuxi build daje mi folder .output z folderami public i server(tu jest express/mongodb)
Normalnie aby odpalić tego builda daje komende "node .output/server/index.mjs"
Jak to dobrze skonfigurować?
Dzięki za pomoc

#vue #nuxt
#mydevil
Rst00
Rst00
  • 1
@Cersin: musisz sobie wrzucić te foldery na mydevilnet, zalogować się na ssh (o ile masz pakiet obsługujący ssh i node) i tam z poziomu konsoli sobie odpalić dokładnie w takim sam sposób node'a + jest chyba też jakaś paczka co to odpala w tle żebyś nie musiał być cały czas połączony.
Radaka
Radaka
  • 2
Trochę się namęczyłem żeby móc używać #nuxt #apollo #graphql #laravel #lighthouse oraz autoryzacji poprzez ciasteczka z Sanctum

Jak zwykle w dokumentacji nie ma nic na ten temat tylko trzeba przeszukać pół internetu może komuś się kiedyś przyda:

import { HttpLink } from 'apollo-link-http'
import { setContext } from 'apollo-link-context'
import { from } from 'apollo-link'
import { InMemoryCache } from 'apollo-cache-inmemory'

export default ({ app, store }) => {
const { baseGQL
orkin2913
orkin2913
  • 1
@Alodnog: a to nie jest przypadkiem tak, że layout renderuje i tak i tak po stronie serwera, a po prostu gdy masz włączony SSR, to Nuxt jeszcze dodatkowo wypełnia ten layout danymi? Żeby osiągnąć takie full client-side render musisz ustawić opcję "mode: 'spa'"
Radaka
Radaka
  • 0
Mam taki problem, korzystam z vue2-editor którego importuje się w taki sposób:
import { VueEditor } from 'vue2-editor'

I teraz jak mam zaimportować go asynchronicznie używając:

const edytor = () => ({
component: import(
'vue2-editor'
),
timeout: 3000
})

?

Lub aby mi nie wywalał w SSR czyli:

components: {
editor: () =>
process.client
? import('vue2-editor')
: Promise.resolve({ render: (h) => h('div') })
}

Nie chce go ładować jako pluginu bo quill
LaylaTichy
LaylaTichy
  • 1
@Radaka:

jak masz single file componenty to coś w tym stylu

components: {
VueEditor: (resolve) => import('vue2-editor')
.then((AsyncComponent) => {
resolve(AsyncComponent.default.VueEditor);
}),
},
ew w app

Vue.component('VueEditor', (resolve) => {
import('vue2-editor')
.then((AsyncComponent) => {
resolve(AsyncComponent.default.VueEditor);
});
});
Radaka
Radaka
  • 1
Zapomniałem wam odpisać

@aso824: Nie lubię być uzależniony od zewnętrznych serwisów gdzie podstawowe działanie mojej aplikacji jest od nich uzależnione

@asdfghjkl: napisałem sobie całość z obsługą socket.io zatem problem rozwiązany
Radaka
Radaka
  • 0
Czy używa ktoś modułu do PWA 3.* i jest w stanie uzyskać cachowanie zdjęć oraz stron w trybie offline ?

Bo niby zdjęcia znajdują się w cache ale jak daje tryb offline to ponownie próbuje załadować stronę oraz zdjęcia z API i już pomysłów nie mam a nie chce mi się zmieniać wersji modułu

#vuejs #nuxt #programowanie
crine
crine
  • 1
Używa ktoś tutaj #nuxt ? Robię call do api po dane przez asyncData() więc ładują mi się one przed wyrenderowaniem strony. I teraz komponent sobie coś tam dodaje nowego do bazy i wysyła event że dane zostały zmienione. Da się teraz wywołać jeszcze raz api call w asyncData() po wykonaniu tego eventu zeby zaktualizował parent i wszystkie componenty?
Czy trzeba użyć czegoś innego niż asyncData?

#vuejs #naukaprogramowania #webdev

Powiązane tagi