How to define routerOptions

Question

How to define routerOptions

techieoriname opened this issue 3 years ago · 6 comments

Great work you have done on this project ✅

However on the main.ts file, routerOptions object seem not to be available to define something like scrollbehavior

export default vitedge(
  App,
  {
    routes,

  // ROUTER OPTIONS

    // Use Router's base for i18n routes
    base: ({ url }) => {
      const locale = extractLocaleFromPath(url.pathname)
      return locale === DEFAULT_LOCALE ? '/' : `/${locale}/`
    },
  },
  async (ctx) => {
    // install all modules under `modules/`
    Object.values(import.meta.globEager('./modules/*.ts')).map((i) =>
      i.install?.(ctx)
    )

    const { app, initialRoute } = ctx

    // Load language asyncrhonously to avoid bundling all languages
    await installI18n(app, extractLocaleFromPath(initialRoute.href))
  }
)

Answer 1 · 2021-12-01T06:30:07.000Z

@techieoriname Thanks! You should be able to pass routerOptions next to routes or base: export default vitedge(App, { routes, routerOptions }, () => {}). Vitedge is passing it to Vite SSR, and used here.

Answer 2 · 2021-12-01T07:18:39.000Z

I get an error on my IDE when I include it

TS2345: Argument of type '{ routes: RouteRecordRaw[]; routerOptions: { scrollBehavior(to: RouteLocationNormalized, from: RouteLocationNormalizedLoaded, savedPosition: { left: number; right: number; }): { left: number; right: number; } | { behavior: string; left: number; top: number; }; }; base: ({ url }: { ...; }) => string; }' is not assignable to parameter of type '{ routes: Record<string, any>[]; base?: ((params: { url: URL; }) => string) | undefined; pageProps?: { passToPage: boolean; } | undefined; debug?: { mount?: boolean | undefined; } | undefined; styleCollector?: any; }'. Object literal may only specify known properties, and 'routerOptions' does not exist in type '{ routes: Record<string, any>[]; base?: ((params: { url: URL; }) => string) | undefined; pageProps?: { passToPage: boolean; } | undefined; debug?: { mount?: boolean | undefined; } | undefined; styleCollector?: any; }'.

Answer 3 · 2021-12-03T12:47:16.000Z

I think the types might be wrong in Vitedge (they are correct in Vite SSR) because this project is still written in pure JS. Can you put a // @ts-ignore on top of it and see if it actually works?

Answer 4 · 2021-12-04T09:49:36.000Z

I think the types might be wrong in Vitedge (they are correct in Vite SSR) because this project is still written in pure JS. Can you put a // @ts-ignore on top of it and see if it actually works?

The scroll behaviour doesn't work yet

Answer 5 · 2021-12-05T14:42:07.000Z

No no, you need to wrap it in routerOptions (for Vue.js):

export default vitedge(App, { routes, routerOptions: { scrollBehavior }, () => {});

You don't need to pass the history, it's done automatically.

Answer 6 · 2021-12-05T15:06:37.000Z

This actually works, but my console is filled up... log below:

4:04:24 PM [vite] Error when evaluating SSR module /node_modules/whatwg-url/lib/public-api.js?v=e3db2eb4:
ReferenceError: exports is not defined
    at /node_modules/whatwg-url/lib/public-api.js?v=e3db2eb4:3:1
    at instantiateModule (/Users/techieoriname/GitHub/vite-edge/node_modules/vite/src/node/ssr/ssrModuleLoader.ts:156:11)
4:04:24 PM [vite] Error when evaluating SSR module /node_modules/node-fetch/lib/index.mjs?v=e3db2eb4:
ReferenceError: exports is not defined
    at /node_modules/whatwg-url/lib/public-api.js?v=e3db2eb4:1:1
    at instantiateModule (/Users/techieoriname/GitHub/vite-edge/node_modules/vite/src/node/ssr/ssrModuleLoader.ts:156:11)
4:04:24 PM [vite] Error when evaluating SSR module /node_modules/firebase/storage/dist/index.mjs?v=e3db2eb4:
TypeError: Line must be greater than or equal to 1, got -1
    at BasicSourceMapConsumer.SourceMapConsumer_findMapping [as _findMapping] (/Users/techieoriname/GitHub/vite-edge/node_modules/.pnpm/source-map@0.6.1/node_modules/source-map/lib/source-map-consumer.js:584:13)
    at BasicSourceMapConsumer.SourceMapConsumer_originalPositionFor [as originalPositionFor] (/Users/techieoriname/GitHub/vite-edge/node_modules/.pnpm/source-map@0.6.1/node_modules/source-map/lib/source-map-consumer.js:653:22)
    at /Users/techieoriname/GitHub/vite-edge/node_modules/vite/src/node/ssr/ssrStacktrace.ts:38:32
    at String.replace (<anonymous>)
    at /Users/techieoriname/GitHub/vite-edge/node_modules/vite/src/node/ssr/ssrStacktrace.ts:22:19
    at Array.map (<anonymous>)
    at ssrRewriteStacktrace (/Users/techieoriname/GitHub/vite-edge/node_modules/vite/src/node/ssr/ssrStacktrace.ts:21:6)
    at instantiateModule (/Users/techieoriname/GitHub/vite-edge/node_modules/vite/src/node/ssr/ssrModuleLoader.ts:165:24)
4:04:24 PM [vite] Error when evaluating SSR module /src/utils/functions.ts:
TypeError: Line must be greater than or equal to 1, got -1
    at BasicSourceMapConsumer.SourceMapConsumer_findMapping [as _findMapping] (/Users/techieoriname/GitHub/vite-edge/node_modules/.pnpm/source-map@0.6.1/node_modules/source-map/lib/source-map-consumer.js:584:13)
    at BasicSourceMapConsumer.SourceMapConsumer_originalPositionFor [as originalPositionFor] (/Users/techieoriname/GitHub/vite-edge/node_modules/.pnpm/source-map@0.6.1/node_modules/source-map/lib/source-map-consumer.js:653:22)
    at /Users/techieoriname/GitHub/vite-edge/node_modules/vite/src/node/ssr/ssrStacktrace.ts:38:32
    at String.replace (<anonymous>)
    at /Users/techieoriname/GitHub/vite-edge/node_modules/vite/src/node/ssr/ssrStacktrace.ts:22:19
    at Array.map (<anonymous>)
    at ssrRewriteStacktrace (/Users/techieoriname/GitHub/vite-edge/node_modules/vite/src/node/ssr/ssrStacktrace.ts:21:6)
    at instantiateModule (/Users/techieoriname/GitHub/vite-edge/node_modules/vite/src/node/ssr/ssrModuleLoader.ts:165:24)
4:04:24 PM [vite] Error when evaluating SSR module /src/components/Navbar.vue:
TypeError: Line must be greater than or equal to 1, got -1
    at BasicSourceMapConsumer.SourceMapConsumer_findMapping [as _findMapping] (/Users/techieoriname/GitHub/vite-edge/node_modules/.pnpm/source-map@0.6.1/node_modules/source-map/lib/source-map-consumer.js:584:13)
    at BasicSourceMapConsumer.SourceMapConsumer_originalPositionFor [as originalPositionFor] (/Users/techieoriname/GitHub/vite-edge/node_modules/.pnpm/source-map@0.6.1/node_modules/source-map/lib/source-map-consumer.js:653:22)
    at /Users/techieoriname/GitHub/vite-edge/node_modules/vite/src/node/ssr/ssrStacktrace.ts:38:32
    at String.replace (<anonymous>)
    at /Users/techieoriname/GitHub/vite-edge/node_modules/vite/src/node/ssr/ssrStacktrace.ts:22:19
    at Array.map (<anonymous>)
    at ssrRewriteStacktrace (/Users/techieoriname/GitHub/vite-edge/node_modules/vite/src/node/ssr/ssrStacktrace.ts:21:6)
    at instantiateModule (/Users/techieoriname/GitHub/vite-edge/node_modules/vite/src/node/ssr/ssrModuleLoader.ts:165:24)
4:04:24 PM [vite] Error when evaluating SSR module /src/layouts/Default.vue:
TypeError: Line must be greater than or equal to 1, got -1
    at BasicSourceMapConsumer.SourceMapConsumer_findMapping [as _findMapping] (/Users/techieoriname/GitHub/vite-edge/node_modules/.pnpm/source-map@0.6.1/node_modules/source-map/lib/source-map-consumer.js:584:13)
    at BasicSourceMapConsumer.SourceMapConsumer_originalPositionFor [as originalPositionFor] (/Users/techieoriname/GitHub/vite-edge/node_modules/.pnpm/source-map@0.6.1/node_modules/source-map/lib/source-map-consumer.js:653:22)
    at /Users/techieoriname/GitHub/vite-edge/node_modules/vite/src/node/ssr/ssrStacktrace.ts:38:32
    at String.replace (<anonymous>)
    at /Users/techieoriname/GitHub/vite-edge/node_modules/vite/src/node/ssr/ssrStacktrace.ts:22:19
    at Array.map (<anonymous>)
    at ssrRewriteStacktrace (/Users/techieoriname/GitHub/vite-edge/node_modules/vite/src/node/ssr/ssrStacktrace.ts:21:6)
    at instantiateModule (/Users/techieoriname/GitHub/vite-edge/node_modules/vite/src/node/ssr/ssrModuleLoader.ts:165:24)
4:04:24 PM [vite] Error when evaluating SSR module /src/routes/index.ts:
TypeError: Line must be greater than or equal to 1, got -1
    at BasicSourceMapConsumer.SourceMapConsumer_findMapping [as _findMapping] (/Users/techieoriname/GitHub/vite-edge/node_modules/.pnpm/source-map@0.6.1/node_modules/source-map/lib/source-map-consumer.js:584:13)
    at BasicSourceMapConsumer.SourceMapConsumer_originalPositionFor [as originalPositionFor] (/Users/techieoriname/GitHub/vite-edge/node_modules/.pnpm/source-map@0.6.1/node_modules/source-map/lib/source-map-consumer.js:653:22)
    at /Users/techieoriname/GitHub/vite-edge/node_modules/vite/src/node/ssr/ssrStacktrace.ts:38:32
    at String.replace (<anonymous>)
    at /Users/techieoriname/GitHub/vite-edge/node_modules/vite/src/node/ssr/ssrStacktrace.ts:22:19
    at Array.map (<anonymous>)
    at ssrRewriteStacktrace (/Users/techieoriname/GitHub/vite-edge/node_modules/vite/src/node/ssr/ssrStacktrace.ts:21:6)
    at instantiateModule (/Users/techieoriname/GitHub/vite-edge/node_modules/vite/src/node/ssr/ssrModuleLoader.ts:165:24)
4:04:24 PM [vite] Error when evaluating SSR module /Users/techieoriname/GitHub/vite-edge/src/main.ts:
TypeError: Line must be greater than or equal to 1, got -1
    at BasicSourceMapConsumer.SourceMapConsumer_findMapping [as _findMapping] (/Users/techieoriname/GitHub/vite-edge/node_modules/.pnpm/source-map@0.6.1/node_modules/source-map/lib/source-map-consumer.js:584:13)
    at BasicSourceMapConsumer.SourceMapConsumer_originalPositionFor [as originalPositionFor] (/Users/techieoriname/GitHub/vite-edge/node_modules/.pnpm/source-map@0.6.1/node_modules/source-map/lib/source-map-consumer.js:653:22)
    at /Users/techieoriname/GitHub/vite-edge/node_modules/vite/src/node/ssr/ssrStacktrace.ts:38:32
    at String.replace (<anonymous>)
    at /Users/techieoriname/GitHub/vite-edge/node_modules/vite/src/node/ssr/ssrStacktrace.ts:22:19
    at Array.map (<anonymous>)
    at ssrRewriteStacktrace (/Users/techieoriname/GitHub/vite-edge/node_modules/vite/src/node/ssr/ssrStacktrace.ts:21:6)
    at instantiateModule (/Users/techieoriname/GitHub/vite-edge/node_modules/vite/src/node/ssr/ssrModuleLoader.ts:165:24)
4:04:24 PM [vite] Internal server error: Line must be greater than or equal to 1, got -1
      at BasicSourceMapConsumer.SourceMapConsumer_findMapping [as _findMapping] (/Users/techieoriname/GitHub/vite-edge/node_modules/.pnpm/source-map@0.6.1/node_modules/source-map/lib/source-map-consumer.js:584:13)
      at BasicSourceMapConsumer.SourceMapConsumer_originalPositionFor [as originalPositionFor] (/Users/techieoriname/GitHub/vite-edge/node_modules/.pnpm/source-map@0.6.1/node_modules/source-map/lib/source-map-consumer.js:653:22)
      at /Users/techieoriname/GitHub/vite-edge/node_modules/vite/src/node/ssr/ssrStacktrace.ts:38:32
      at String.replace (<anonymous>)
      at /Users/techieoriname/GitHub/vite-edge/node_modules/vite/src/node/ssr/ssrStacktrace.ts:22:19
      at Array.map (<anonymous>)
      at ssrRewriteStacktrace (/Users/techieoriname/GitHub/vite-edge/node_modules/vite/src/node/ssr/ssrStacktrace.ts:21:6)
      at instantiateModule (/Users/techieoriname/GitHub/vite-edge/node_modules/vite/src/node/ssr/ssrModuleLoader.ts:165:24)