Question Firebase - Mettre des fichiers dans plusieurs répertoires


J'essaie d'organiser mon projet pour le rendre plus maintenable. J'ai un grand nombre de modèles HTML et je suis obligé de les mettre tous dans le répertoire public. Je voulais vraiment l'organiser comme ça

public directory
  views
    index.html
    register.html
    terms.html
    privacy.html
    support.html
  stylesheets
    styles.css
  scripts
    script.js
    authentication.js

mais au lieu de cela, il ressemble à ceci

public
  index.html
  register.html
  terms.html
  privacy.html
  support.html
  script.js
  authentication.js
  styles.css

Voici mon firebase.json fichier

   {
  "firebase": "funmathgame",
  "public": "mathgame",
  "ignore": [
    "firebase.json",
    "**/.*",
    "**/node_modules/**"
  ]
}

Voici le message d'erreur que je reçois

Page non trouvée

Le fichier n'existe pas et il n'y avait pas de index.html trouvé dans le répertoire en cours ou 404.html dans le répertoire racine.

Pourquoi est-ce que je vois ceci?

Vous avez peut-être déployé le mauvais répertoire pour votre application. Vérifier votre firebase.json et assurez-vous que le Publique répertoire pointe vers un répertoire qui contient un index.html fichier.

Vous pouvez également ajouter un 404.html dans la racine de votre site pour remplacer cette page par une page d'erreur personnalisée.

La première structure est meilleure car elle sépare le code. Cette structure fonctionne à chaque fois que je lance les fichiers dans mon éditeur de texte. Cependant, il ne fonctionne pas chaque fois que je déploie sur une base de données.

Par exemple, voici comment je ferais référence à mes feuilles de style

<head>
  <title>Frequently Asked Questions</title>
  <link rel='stylesheet' href='https://maxcdn.bootstrapcdn.com/bootstrap/3.2.0/css/bootstrap.min.css'> 
  </link>
<link rel='stylesheet' href='../stylesheets/styles.css'></link>

Dans la structure de répertoires ci-dessus, je suis dans le public/views annuaire. j'utilise .. pour reculer d'un répertoire dans le répertoire public, puis transférer dans le répertoire des feuilles de style. Cependant, voici mon index.html fichier n'est pas dans le répertoire public, mais plutôt le public/views annuaire.

J'ai regardé le site Web de Firebase, mais je ne trouve toujours aucune idée.

https://www.firebase.com/docs/hosting/guide/full-config.html


25
2018-01-16 16:14


origine


Réponses:


Si vous êtes disposé à /views/index.html dans la barre d'adresse de votre application, vous pouvez simplement faire une redirection à partir de / en ajoutant un redirects élément à votre firebase.json. Il ressemble aussi à votre public attribut peut être incorrect. Alors changez votre firebase.json fichier à:

{
  "firebase": "funmathgame",
  "public": "public",
  "ignore": [
    "firebase.json",
    "**/.*",
    "**/node_modules/**"
  ],
  "redirects": [
    {
      "source": "/",
      "destination": "/views/index.html",
      "type": 302
    }
  ]
}

De cette façon, tout utilisateur qui se rend sur https://funmathgame.firebaseapp.com/ sera redirigé vers https://funmathgame.firebaseapp.com/views/index.html et toutes les URL relatives seront résolues correctement.


10
2018-02-01 06:24



C'était un problème difficile à coup sûr. Lorsque vous déployez sur Firebase, Firebase recherche un index.html fichier dans votre répertoire public. Ce répertoire public est également appelé répertoire racine.

Je travaillais avec une application angulaire et j'utilisais simplement les mauvais chemins dans mes partiels. C'était assez difficile cependant.

Je devais mettre en place un contrôleur angulaire, qui injectait le $document dépendance pour obtenir le titre d'une page. Si le titre de la page correspondait au titre de la page racine, j'utiliserais ng-href pour ajouter le views répertoire à l'URL relative.

Sinon, si vous étiez dans le répertoire des vues et que vous avez cherché d'autres vues, cela afficherait un chemin comme views/views/page1.html. C'est pourquoi nous avons un autre ng-href conditionnel pour ceux-ci.

Voici à quoi ressemblait ma navigation

<ul class='nav navbar-nav'>

        <li><a ng-href="{{ page == home ? 'views/help.html' : 'help.html' }}">Help</a></li>
        <li><a ng-href="{{ page == home ? 'views/achievements.html' : 'achievements.html' }}">Achievements</a></li>
        <li><a ng-href="{{ page == home ? 'views/scores.html' : 'scores.html' }}">Scores</a></li>
        <li><a ng-href="{{ page == home ? 'views/shop.html' : 'shop.html' }}">Shop</a></li>
        <li><a ng-href="{{ page == home ? 'views/faq.html' : 'faq.html' }}">FAQs</a></li>
        <li><a ng-href="{{ page == home ? 'views/related.html': 'related.html' }}">More Games</a></li>
</ul>

Au final, ma structure de répertoire ressemblait à ceci

public
  assets
    stylesheets
      styles.css
  views
    partials
      scripts.html
      header.html
      footer.html
    page1.html
    ...
  scripts
    controllers
    script1.js
    ...
  index.html

Il est également possible de placer le fichier d'index dans le répertoire views si vous modifiez le fichier firebase.json.

{
    "firebase": "firebase-app",
    "public": "root/views",
    "ignore": [
      "firebase.json",
      "**/.*",
      "**/node_modules/**"
    ]
}

Vous modifiez simplement le mot-clé public dans l'application Firebase. Il a fallu beaucoup de bidouillage, parce que j'avais oublié que je devais changer conditionnellement les chemins. De plus, pour retourner dans le répertoire précédent, vous devez faire quelque chose comme: ../


8
2018-02-01 18:27



Je pense que ce site peut vous être utile: https://www.firebase.com/blog/2014-08-12-switching-to-firebase.html

Notamment,

Étant donné que Firebase importe un seul fichier et que certains services exportent plusieurs fichiers, j'ai créé un script Python pratique qui convertira plusieurs fichiers en un seul fichier Firebase assaini.


2
2018-02-07 17:47