Nextjs переписывают со статически экспортированным приложением
У меня есть два приложения Nextjs:
1_ webapp - гибридный
2_ блог - статический (экспортируется при следующем экспорте)
Они разворачиваются отдельно.
Я хочу связать веб-приложение с приложением внешнего блога. Когда пользователь нажимает «блог» в веб-приложении, он должен попасть в статическое приложение блога. Для этого я пытаюсь использовать перезаписи Nextjs .
В моем веб-приложении я делаю:
async rewrites() {
return [
{
source: '/blog',
destination: 'https://myblog.azurestaticapps.net/blog',
},
]
},
Затем в приложении блога в
next.config.js
Я делаю:
const baseUrl = '/blog';
module.exports = withBundleAnalyzer({
poweredByHeader: false,
trailingSlash: true,
basePath: baseUrl,
assetPrefix: baseUrl,
});
Проблема в:
- Когда я развертываю приложение блога в статическом веб-приложении Azure, (домашняя страница моего приложения блога) становится доступной в
https://myblog.azurestaticapps.net
а не подhttps://myblog.azurestaticapps.net/blog
что означает, что css и js не загружены
Пример js-запроса в blog-app / index.html:
/blog/_next/static/chunks/main-d3b8bc8211fdf94f30b0.js
Можете посмотреть здесь: https://purple-coast-094447810.azurestaticapps.net/
Я читал о
exportPathMap
в Nextjs и попытался использовать его, но в моей папке сборки я получаю
-
index.html
в моей корневой папке -
/blog
папка в моем корне пуста. Никаких файлов внутри. Вот как я его использую:
module.exports = withBundleAnalyzer({
poweredByHeader: false,
trailingSlash: true,
basePath: baseUrl,
assetPrefix: baseUrl,
env: {
baseUrl: baseUrl,
},
exportPathMap: async function (
defaultPathMap,
{ dev, dir, outDir, distDir, buildId }
) {
return {
'/blog': { page: '/' },
}
},
});
Мне известен этот пример из Nextjs - с зонами: https://github.com/vercel/next.js/tree/canary/examples/with-zones, но он предназначен для динамического приложения, а не для статического экспорта.