Référencement de fichiers CSS et JS dans les pages Github?

Récemment j'ai essayé de faire un site Web.Référencement de fichiers CSS et JS dans les pages Github?

Je fais tout le contenu localement et le pousse sur des pages github, je change déjà le chemin de toutes les images et CSS et JS vers le référentiel. Toutes les images fonctionnent bien, mais mon fichier HTML ne se connecte pas aux fichiers CSS et JS. J'ai fait un peu de recherche et j'ai découvert que nous pouvions utiliser rawgit.com comme CDN, mais ça ne marche pas pour moi. Je sais que cela devrait être possible puisque j'ai vu des gens utiliser des pages github et que leur css fonctionne bien, je ne peux pas le faire fonctionner. Voici mon repo et index.

https://github.com/andygiovanny/andygiovanny.github.io 
https://github.com/andygiovanny/andygiovanny.github.io/blob/master/index.html

est ici sur mes fichiers locaux Local Files et est ici sur github enter image description here

Je suis tout à fait nouveau à cela et dans l'espoir d'obtenir de l'aide, merci d'avance !!

Source

2017-09-21 Andy Giovanny Febrianto

Il est préférable dans ce cas d'utiliser relative urls pour vos fichiers statiques hébergé sur votre propre site, donc par exemple le changement:

<link href="andygiovanny.github.io/css/style.css" rel="stylesheet">

simplement:

<link href="/css/style.css" rel="stylesheet">

De cette façon, il se chargera pour vous dans n'importe quel environnement dans lequel vous travaillez. J'utilise quelque chose appelé middleman pour construire mon site sur les pages GitHub et ils font la même chose que peut être vu dans mon repo.

C'est la même pour les liens contenus dans vos fichiers CSS aussi, par exemple, vous faites référence à vos images ci-dessous:

.mainContent{ 
    width: 100%; 
    height: auto; 
    background-image: url('andygiovanny.github.io/IMAGE FILE/Background.svg'); 
    background-repeat: repeat-x; 
}

Mais il doit être comme:

.mainContent{ 
    width: 100%; 
    height: auto; 
    background-image: url('/IMAGE FILE/Background.svg'); 
    background-repeat: repeat-x; 
}

En note latérale, il est conseillé de ne pas avoir d'espaces dans vos emplacements de fichiers et par convention, ils devraient être en minuscules, avec des traits d'union remplaçant les espaces, je renomme IMAGE FILE en image-file.

Source

2017-09-21 08:15:39

Salut, merci pour la réponse. Je l'édite, mais malheureusement, il ne lit toujours pas le javascript et le CSS. Je suis également confus sur ce qui ne va pas. –

Je viens de trouver votre site sur https://andygiovanny.github.io/ et le CSS se charge bien pour moi ... –

Je ne sais pas pourquoi ça ne marche pas pour moi, laissez-moi joindre une capture d'écran de celui-ci sur mon message (mis à jour, semble que le CSS et JS ne fonctionnent pas) pour moi au moins –

Vous devez inclure les scripts et les feuilles de style sur le protocole HTTPS. Regardez simplement la console. Ou vous pouvez télécharger les feuilles de style et les scripts et passer à votre dossier. Vous pouvez donc inclure des dossiers de projet.

<script src="js/jquery.min.js"></script> <!-- Like this! -->

Source

2017-09-21 08:45:11 selmansamet

Référencement de fichiers CSS et JS dans les pages Github?

Répondre

Questions connexes