Невозможно создать Gridsome сайт с плавной прокруткой Vue2 - PullRequest
Новая
       53

Невозможно создать Gridsome сайт с плавной прокруткой Vue2

1 голос
/ 04 апреля 2020

Он работает в режиме разработки, но не создает: 'ReferenceError: окно не определено'

Я действительно понимаю, что это проблема с поддержкой SSR, хотя он говорит, что имеет поддержку

Я попытался реализовать некоторые похожие подходы интеграции, как показано здесь:

https://gridsome.org/docs/assets-scripts/#without -ssr-support

Импорт Vue -Navigation-Bar в Gridsome

Я пробовал много подходов в main. js и моем шаблоне. vue файлов, но я не понимаю logi c для идеальной адаптации решения.

Мой последний подход, который работал над разработкой:

На моем шаблоне. vue Файл: 

<section id="cover"></section>

<ClientOnly><p class="text-light">Text <a :href="href" class="text-light under" v-smooth-scroll="{ duration: 1000, updateHistory: false }">click here</a></p></ClientOnly>

<script>
  import Vue from 'vue'
  import vueSmoothScroll from 'vue2-smooth-scroll'
  Vue.use(vueSmoothScroll)
</script>

Также Я пытался установить опцию 'container' для '#app' или '#body', добавленных в тело, но это не сработало даже при разработке.

1 Ответ

0 голосов
/ 05 апреля 2020

ОК, я могу найти его здесь:

https://github.com/gridsome/gridsome/issues/180#issuecomment -513550238

Для него не нужны <ClientOnly></ClienteOnly> теги в шаблоне. vue file

В main. js, я внес следующие изменения: 

//import vueSmoothScroll from 'vue2-smooth-scroll'
//Vue.use(vueSmoothScroll);

export default function (Vue, { router, head, isClient }) {
  ...
  if (process.isClient) {
    const vueSmoothScroll = require('vue2-smooth-scroll').default;
    Vue.use(vueSmoothScroll);
  }
}
...