На днях столкнулся с проблемой с Nuxt I18n при разработке блога.
Проблема заключалась в том, что как только к URL приписывался
/
- NuxtLink переставал работать.Я достаточно долго гадал чем может быть корень этой проблемы и бродил по другим проектам (ибо изначально
было предположение что это ошибка vue-router и его генерации роутов в Nuxt). Однако, в других проектах
все работало хорошо.
Затем в поисках решения проблемы я начал отключать модули Nuxt один за другим, все, помимо Nuxt I18n, ибо
он глубоко интегрирован в мой проект и отключить его стоило больших трудозатрат. Такой поиск методом "научного тыка"
не дал результатов.
Позже, я все же решил немного поменять стратегию роутинга в Nuxt i18n и случилось чудо, все заработало 🎉
Для того чтобы воспроизвести проблему, достаточно клонировать проект данного блога и откатиться на коммит
569ec257fabb133e44519b8526aa4142acb8f3e8
.
После клонирования нужно установить зависимости и запустить проект, после перехода на localhost:8100/projects
достаточно просто дописать слэш в конце: localhost:8100/projects/
Проблема заключалась в том что при роутинге без префиксов (была выбрана стратегия
no_prefix
) Nuxt I18n видимо как-то переписывал пути (хотя не должен был этого делать).
Там где в конце стоял /
- навигация срабатывала некорректно (не находила компонент) и Guard выкидывал нас обратно на страницу с которой мы пытались уйти.Решение
Решалась данная проблема достаточно тривиально (хоть и трудозатратно), я просто изменил стратегию на
prefix_except_default
,
а затем переходы по всем ссылкам обернул в localePath
, как это описано в гайде.