Блог

Я использую algolia instant search в своем приложении vue js, работающем на платформе quasar framework в режиме ssr. Я хочу выполнять маршрутизацию в своем приложении с помощью виджетов мгновенного поиска. Документы подробно описаны здесь.

Я следую инструкциям, которые очень просты. Я импортирую следующее:

 import { history as historyRouter } from 'instantsearch.js/es/lib/routers';
import { singleIndex as singleIndexMapping } from 'instantsearch.js/es/lib/stateMappings';
 

Затем в моих данных я инициализирую объекты маршрутизации:

 data() {
  return {
    searchClient: algoliasearch(
      "",
      ""
    ),
    routing: {
      router: historyRouter(),
      stateMapping: singleIndexMapping("instant_search"),
    },
  };
},
 

После этого момента, если я попытаюсь обновить свою страницу, я получаю следующую ошибку, указывающую на импорт stateMappings и импорт маршрутизации:

 Unexpected token 'export'
Open: internal/modules/cjs/loader.js
Unable to locate file source.
 

Я совершенно уверен, что это связано с запуском моего приложения vue quasar в ssr режиме mode, но интересно то, что я явно запускаю algolia на клиенте только так, как указано в моем quasar.conf.js файл и обертывание компонента, который я написал, который запускает мгновенный поиск algolia в <q-no-ssr> теге:

     boot: [
        'axios',
         {path: 'algolia', server: false},
    ],
 

  <q-no-ssr>
    <SearchComponent :numHits="4" :homePage="true" />
 </q-no-ssr>

 

Как я могу использовать маршрутизацию, историю и сопоставления состояний algolia instant search таким образом?

Я получил ту же ошибку при использовании Algolia с Nuxt (поэтому не использую quasar).

Что решило проблему для меня, так это убедиться, что зависимости правильно переданы в конфигурацию nuxt:

  build: { 
   transpile: ['vue-instantsearch', 'instantsearch.js/es'], 
 }, 
 

Возможно, необходимо предпринять аналогичные действия, чтобы заставить его работать для quasar?