Nano Hash - криптовалюты, майнинг, программирование

Как настроить мультисайты Firebase для хостинга с Nextjs

Я пытаюсь развернуть приложение nextjs на хостинге firebase и хочу поддерживать несколько сайтов. Когда я его развертываю, все приложение отображает приложение по умолчанию. Как я могу это исправить?

Я следил за руководством здесь по развертыванию нескольких сайтов для firebase с использованием AngularJs, и я попытался заменить Angularjs на NextJs

скрипты в package.json

{
  "scripts": {
    "accounts": "next \"src/apps/accounts/\"",
    "accounts-build": "next build \"src/apps/accounts/\"",

    "admin": "next \"src/apps/admin/\"",
    "admin-build": "next build \"src/apps/admin/\"",
    "preserve": "npm run build-public && npm run build-funcs && npm run admin-build && npm run copy-deps && npm run install-deps",
    "serve": "cross-env NODE_ENV=production firebase serve",
    "predeploy": "npm run build-public && npm run build-funcs && npm run accounts-build && npm run admin-build && npm run copy-deps",
    "deploy": "firebase deploy",
    "clean": "rimraf \"dist/functions/**\" && rimraf \"dist/public\"",
    "build-public": "cpx \"src/public/**/*.*\" \"dist/public\" -C",
    "build-funcs": "babel \"src/functions\" --out-dir \"dist/functions\"",
    "copy-deps": "cpx \"*{package.json,package-lock.json,yarn.lock}\" \"dist/functions\" -C",
    "install-deps": "cd \"dist/functions\" && npm i"
  }
}

firebase.json

{
  "hosting": [
    {
      "target": "accounts",
      "public": "dist/public",
      "rewrites": [
        {
          "source": "**/**",
          "function": "accounts"
        }
      ]
    },
    {
      "target": "admin",
      "public": "dist/public",
      "rewrites": [
        {
          "source": "**/**",
          "function": "admin"
        }
      ]
    }
  ],
  "functions": {
    "source": "dist/functions"
  }
}

.firebaserc

{
  "projects": {
    "default": "example-app"
  },
  "targets": {
    "example-app": {
      "hosting": {
        "accounts": [
          "example-accounts"
        ],
        "admin": [
          "example-admin"
        ]
      }
    }
  }
}

index.js в функциях

import {https} from 'firebase-functions'

const dev = process.env.NODE_ENV !== 'production'
const app = require('next')({dev, conf: {distDir: 'next'}})
const handle = app.getRequestHandler()

const accounts = https.onRequest((req, res) =>
    app.prepare().then(() => handle(req, res)))

const admin = https.onRequest((req, res) =>
    app.prepare().then(() => handle(req, res)))

export {accounts, admin}

next.config.js переместил его в корневую папку

module.exports = {
  distDir: '../../../dist/functions/next'
}

Все приложения отображают приложение Accounts по умолчанию. хотел бы, чтобы администратор отобразил приложение администратора.


Ответы:


1

Поскольку у вас есть разные папки в качестве администратора и учетных записей в каталоге приложений, поэтому при создании сборки для каждой из них next.js всегда учитывает последнюю сборку, которую вы делаете, и обслуживает страницы последней сборки, поэтому для решения этой проблемы у нас есть для создания сборок в разных каталогах для администратора каталог будет

dist / functions / admin / next

а для покупателя каталог будет

dist / functions / accounts / next

вы должны определить для этого другой distDir, чтобы при обслуживании страницы он выглядел в указанном каталоге, поэтому, пожалуйста, измените свой

next.config.js для администратора

module.exports = {
  distDir: '../../../dist/functions/admin/next'
}

next.config.js для аккаунтов

module.exports = {
  distDir: '../../../dist/functions/accounts/next'
}

сохраните этот next.config.js в каталогах src / apps / admin и src / apps / customer соответственно и измените свой

index.js в функциях

import {https} from 'firebase-functions'

const dev = process.env.NODE_ENV !== 'production'
const appAdmin = require('next')({dev, conf: {distDir: 'admin/next'}});

const appAccounts= require('next')({dev, conf: {distDir: 'accounts/next'}});

const handle = app.getRequestHandler()

const accounts = https.onRequest((req, res) =>
    appAccounts.prepare().then(() => handle(req, res)))

const admin = https.onRequest((req, res) =>
    appAdmin.prepare().then(() => handle(req, res)))

export {accounts, admin}
15.05.2019

2

Я продублировал build-public в package.json и соответственно обновил firebase.json, и это сработало.

package.json

"scripts": {
   "accounts": "next \"src/apps/accounts/\"",
   "accounts-build": "next build \"src/apps/accounts/\"",
   "accounts-build-public": "cpx \"src/public/**/*.*\" \"dist/accounts/public\" -C",

   "admin": "next \"src/apps/admin/\"",
   "admin-build": "next build \"src/apps/admin/\"",
   "admin-build-public": "cpx \"src/public/**/*.*\" \"dist/admin/public\" -C", 
   ...

firebase.json

обновлено "public": "dist/public" до "public": "dist/admin/public" и "public": "dist/accounts/public"

09.02.2019
Новые материалы

Кластеризация: более глубокий взгляд
Кластеризация — это метод обучения без учителя, в котором мы пытаемся найти группы в наборе данных на основе некоторых известных или неизвестных свойств, которые могут существовать. Независимо от..

Как написать эффективное резюме
Предложения по дизайну и макету, чтобы представить себя профессионально Вам не позвонили на собеседование после того, как вы несколько раз подали заявку на работу своей мечты? У вас может..

Частный метод Python: улучшение инкапсуляции и безопасности
Введение Python — универсальный и мощный язык программирования, известный своей простотой и удобством использования. Одной из ключевых особенностей, отличающих Python от других языков, является..

Как я автоматизирую тестирование с помощью Jest
Шутка для победы, когда дело касается автоматизации тестирования Одной очень важной частью разработки программного обеспечения является автоматизация тестирования, поскольку она создает..

Работа с векторными символическими архитектурами, часть 4 (искусственный интеллект)
Hyperseed: неконтролируемое обучение с векторными символическими архитектурами (arXiv) Автор: Евгений Осипов , Сачин Кахавала , Диланта Хапутантри , Тимал Кемпития , Дасвин Де Сильва ,..

Понимание расстояния Вассерштейна: мощная метрика в машинном обучении
В обширной области машинного обучения часто возникает необходимость сравнивать и измерять различия между распределениями вероятностей. Традиционные метрики расстояния, такие как евклидово..

Обеспечение масштабируемости LLM: облачный анализ с помощью AWS Fargate и Copilot
В динамичной области искусственного интеллекта все большее распространение получают модели больших языков (LLM). Они жизненно важны для различных приложений, таких как интеллектуальные..