ermolaevalexey
@ermolaevalexey
frontend веб-разработчик

Как подружить Backbone Router и Webpack-dev-server?

Пытаюсь настроить Backbone Router так, чтобы он обрабатывал url без хеша после слеша
e.g (` localhost:9500/photos/1234 ` вместо ` localhost:9500/#photos/1234 `).

В главном файле создаю новый инстанс роутера и вызываю ` Backbone.history.start({ pushState: true }) `.

К сожалению по клику на ссылку, страница продолжает перезагружаться, и естесвенно, падает 404. Опция ` historyApiFallback ` в конгфиге дев сервреа толку не дает, лишь только перенаравляет на рутовый путь.

То есть мои url не перехватываются роутером. Если в url есть хеш, то она обрабатывается, иначе нет. Как можно это нормально настроить?

Да, я использую handlebars для шаблонизации, и шаблон вьюхи фотографии выглядит примерно так:

<article class="photo__item">

    <a href="photos/{{ id }}">

      {{ id }} <br>
      {{ date }} <br>

      <img src="{{ baseImage }}" alt="">

      <p>{{ text }}</p>

    </a>
  </article>


Конфиг дев-сервреа выглядит так:

devServer: {
    contentBase: path.join(__dirname, "./server"),
    publicPath: "/public/",

    historyApiFallback: {
      index: "/"
    },

    compress: true,
    hot: true,

    port: 9500
  },


Роут к детальному фото в классе роутера

get routes() {

    return {
      "photos/:id": "getDetail"
    };

  }

  //Пока хотя бы записать в консоль
  getDetail(query) {
    console.log(query);
  }


И вызов главной вьюхи:
$(() => {

  moment.locale("ru");

  VK.init({ apiId });

  const mainView = new MainView();

  rootNode.append(
    mainView.render().$el);

  const router = new Router();

  Backbone.history.start({ pushState: true });

});
  • Вопрос задан
  • 226 просмотров
Пригласить эксперта
Ваш ответ на вопрос

Войдите, чтобы написать ответ

Войти через центр авторизации
Похожие вопросы