Я пытаюсь реализовать переходы страниц на моем сайте. Прямо сейчас я выбрал " Highway JS" (я также использую Webpack).
Моя проблема в том, что при загрузке моей новой страницы сценарии и стили не перезагружаются. Я посмотрел документы по шоссе, и я нашел это : некоторые функции для перезагрузки скриптов и стилей. Но я не могу понять, как реализовать эти две функции в моем проекте ...
Сейчас у меня есть 2 страницы (скажем, Home и About). На каждой странице есть общие файлы, а также определенные c javascript файлы (в веб-пакете я создал куски "chunks: ['commons', 'vendors', 'app', pathname],
"), то же самое для css (на каждой странице есть общий файл css, а также специфический c один).
Я реализовал простой переход Fade. Вот как выглядит файл моего приложения. js
import './scss/main.scss';
import $ from 'jquery';
import { TimelineMax, TweenMax, Power4, Power3, Power2, Power1 } from 'gsap/TweenMax';
import Highway from '@dogstudio/highway';
import './components/shared/cursor';
import './components/shared/menu';
import './components/shared/loadingScreen';
import Fade from './components/shared/fade';
import homeRenderer from './components/renderers/home';
window.jQuery = $;
window.$ = $;
const H = new Highway.Core({
transitions: {
default: Fade
}
});
// H.on('NAVIGATE_END', ({ location }) => {});
- Как добавить определенный идентификатор в тег скрипта в веб-пакете, чтобы я мог его реализовать? (Первая строка этих функций:
const main =
document.querySelector('#main-script');
, я понимаю, что мне нужно добавить идентификатор в мой основной скрипт. Что если я использую несколько скриптов, таких как vendors, main, et c.?) - Как я могу реализовать эти 2 сценария? Смысл, где я должен положить это? (я создаю
H.on('NAVIGATE_END', ({ location }) => {});
и помещаю 2 функции внутрь?)