Size: a a a

Nuxt.js | Vue SSR

2021 February 25

MS

Maxim Stikharev in Nuxt.js | Vue SSR
Всем привет, начал недавно тыкать nuxt. Решил сделать базовое приложение и вот с подключением библиотек у меня проблема.
Хочу заюзать vuejs-paginate, поддержки ssr у неё нет. Мои шаги:
1. Установил через yarn add пакет
2. Добавил в plugins/vuejs-paginate.js
import Vue from 'vue'
import Paginate from 'vuejs-paginate'
Vue.use(Paginate)

3. В nuxt.config.js добавил
plugins: [
   {src: '~/plugins/vuejs-paginate', mode:'client'},
 ],

4. В странице добавил
import Paginate from "vuejs-paginate";
и закинул его в components.
5. Вывел по примеру из доки в шаблон
<paginate
       :page-count="20"
       :prev-text="'Prev'"
       :next-text="'Next'"
       :container-class="'className'">
     </paginate>

6. На странице window is not defined.

Вопрос: Как правильно проставить плагин чтобы он заработал?)
Также пробовал обернуть в тег no-ssr
источник

ПЗ

Пассивный Заработок... in Nuxt.js | Vue SSR
Все же надеюсь на помощь
источник

AD

Aleksandr Dergunov in Nuxt.js | Vue SSR
Пассивный Заработок
Hello бродяги, простите что по английски, но мне нужна ваша помощь, как вы можете догадаться я использую Nuxt, у меня сервер апач доступ соответственно нет, при запуске приложения он даёт локалхост3к как мне использовать приложение по доменному имени например domain.com
Тут есть тег деплой вроде как
источник

V

Vlad in Nuxt.js | Vue SSR
Maxim Stikharev
Всем привет, начал недавно тыкать nuxt. Решил сделать базовое приложение и вот с подключением библиотек у меня проблема.
Хочу заюзать vuejs-paginate, поддержки ssr у неё нет. Мои шаги:
1. Установил через yarn add пакет
2. Добавил в plugins/vuejs-paginate.js
import Vue from 'vue'
import Paginate from 'vuejs-paginate'
Vue.use(Paginate)

3. В nuxt.config.js добавил
plugins: [
   {src: '~/plugins/vuejs-paginate', mode:'client'},
 ],

4. В странице добавил
import Paginate from "vuejs-paginate";
и закинул его в components.
5. Вывел по примеру из доки в шаблон
<paginate
       :page-count="20"
       :prev-text="'Prev'"
       :next-text="'Next'"
       :container-class="'className'">
     </paginate>

6. На странице window is not defined.

Вопрос: Как правильно проставить плагин чтобы он заработал?)
Также пробовал обернуть в тег no-ssr
обернуть компонент в client-only
источник

НЧ

Норм Чел in Nuxt.js | Vue SSR
Пассивный Заработок
Все же надеюсь на помощь
По идее настраивать через nginx https://ru.nuxtjs.org/docs/2.x/deployment/nginx-proxy
источник

MS

Maxim Stikharev in Nuxt.js | Vue SSR
Maxim Stikharev
Всем привет, начал недавно тыкать nuxt. Решил сделать базовое приложение и вот с подключением библиотек у меня проблема.
Хочу заюзать vuejs-paginate, поддержки ssr у неё нет. Мои шаги:
1. Установил через yarn add пакет
2. Добавил в plugins/vuejs-paginate.js
import Vue from 'vue'
import Paginate from 'vuejs-paginate'
Vue.use(Paginate)

3. В nuxt.config.js добавил
plugins: [
   {src: '~/plugins/vuejs-paginate', mode:'client'},
 ],

4. В странице добавил
import Paginate from "vuejs-paginate";
и закинул его в components.
5. Вывел по примеру из доки в шаблон
<paginate
       :page-count="20"
       :prev-text="'Prev'"
       :next-text="'Next'"
       :container-class="'className'">
     </paginate>

6. На странице window is not defined.

Вопрос: Как правильно проставить плагин чтобы он заработал?)
Также пробовал обернуть в тег no-ssr
решил проблему, не Vue.use а Vue.component
источник

S

Sonic [Скупаю | Акту... in Nuxt.js | Vue SSR
Maxim Stikharev
Всем привет, начал недавно тыкать nuxt. Решил сделать базовое приложение и вот с подключением библиотек у меня проблема.
Хочу заюзать vuejs-paginate, поддержки ssr у неё нет. Мои шаги:
1. Установил через yarn add пакет
2. Добавил в plugins/vuejs-paginate.js
import Vue from 'vue'
import Paginate from 'vuejs-paginate'
Vue.use(Paginate)

3. В nuxt.config.js добавил
plugins: [
   {src: '~/plugins/vuejs-paginate', mode:'client'},
 ],

4. В странице добавил
import Paginate from "vuejs-paginate";
и закинул его в components.
5. Вывел по примеру из доки в шаблон
<paginate
       :page-count="20"
       :prev-text="'Prev'"
       :next-text="'Next'"
       :container-class="'className'">
     </paginate>

6. На странице window is not defined.

Вопрос: Как правильно проставить плагин чтобы он заработал?)
Также пробовал обернуть в тег no-ssr
4. В странице добавил

Этот пункт не нужен, если стоит components: true
источник

MS

Maxim Stikharev in Nuxt.js | Vue SSR
ага, тоже убрал
источник

J

JS-master in Nuxt.js | Vue SSR
Привет всем
источник

J

JS-master in Nuxt.js | Vue SSR
Есть хорошие курсы или книги по NuxtJS
источник

J

JS-master in Nuxt.js | Vue SSR
На русском?
источник

СР

Сергей Рыжков... in Nuxt.js | Vue SSR
Sonic [Скупаю | Актуально всегда]
4. В странице добавил

Этот пункт не нужен, если стоит components: true
немного не так :) , сomponents:true - не о том
источник

S

Sonic [Скупаю | Акту... in Nuxt.js | Vue SSR
Сергей Рыжков
немного не так :) , сomponents:true - не о том
Можно уточнить?
источник

СР

Сергей Рыжков... in Nuxt.js | Vue SSR
Maxim Stikharev
Всем привет, начал недавно тыкать nuxt. Решил сделать базовое приложение и вот с подключением библиотек у меня проблема.
Хочу заюзать vuejs-paginate, поддержки ssr у неё нет. Мои шаги:
1. Установил через yarn add пакет
2. Добавил в plugins/vuejs-paginate.js
import Vue from 'vue'
import Paginate from 'vuejs-paginate'
Vue.use(Paginate)

3. В nuxt.config.js добавил
plugins: [
   {src: '~/plugins/vuejs-paginate', mode:'client'},
 ],

4. В странице добавил
import Paginate from "vuejs-paginate";
и закинул его в components.
5. Вывел по примеру из доки в шаблон
<paginate
       :page-count="20"
       :prev-text="'Prev'"
       :next-text="'Next'"
       :container-class="'className'">
     </paginate>

6. На странице window is not defined.

Вопрос: Как правильно проставить плагин чтобы он заработал?)
Также пробовал обернуть в тег no-ssr
а зачем тебе плагин (глобально компонент регистрировать) ?
источник

СР

Сергей Рыжков... in Nuxt.js | Vue SSR
я просто не совсме понял (или не так понял) причем тут components: true и импорт?
источник

S

Sonic [Скупаю | Акту... in Nuxt.js | Vue SSR
Сергей Рыжков
я просто не совсме понял (или не так понял) причем тут components: true и импорт?
Если мы подключили плагин глобально, то components: true сам подтянет компонент из плагина
источник

S

Sonic [Скупаю | Акту... in Nuxt.js | Vue SSR
Сергей Рыжков
а зачем тебе плагин (глобально компонент регистрировать) ?
И тут мне стало интересно, а есть лучше решение? Я тоже плагинами цепляю пакеты работающие с document или window. Ведь если мы сделаем такой import локально, но на нас как раз заругается nuxt :) хер ли ты юзаешь window при SSR, независимо от client-only
источник

СР

Сергей Рыжков... in Nuxt.js | Vue SSR
Sonic [Скупаю | Актуально всегда]
Если мы подключили плагин глобально, то components: true сам подтянет компонент из плагина
не, немного не так. Ты же и так уже импортнул и зарегистрировал (Vue.compoent...) ,
А components: true для другого, глян сырцы,
https://github.com/nuxt/components/blob/main/src/index.ts
источник

СР

Сергей Рыжков... in Nuxt.js | Vue SSR
Sonic [Скупаю | Актуально всегда]
И тут мне стало интересно, а есть лучше решение? Я тоже плагинами цепляю пакеты работающие с document или window. Ведь если мы сделаем такой import локально, но на нас как раз заругается nuxt :) хер ли ты юзаешь window при SSR, независимо от client-only
решения есть, конечно
Но в данном случае, что-то не припомню в vuejs-paginate использование window в принципе
источник

S

Sonic [Скупаю | Акту... in Nuxt.js | Vue SSR
Сергей Рыжков
не, немного не так. Ты же и так уже импортнул и зарегистрировал (Vue.compoent...) ,
А components: true для другого, глян сырцы,
https://github.com/nuxt/components/blob/main/src/index.ts
Да, спасибо. Тогда моя фраза в корне не верна, а не "не совсем" :)
источник