La liaison à la css de fichiers à partir de réagir index
J'ai ce simple indice :
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1">
<meta name="description" content="">
<meta name="author" content="">
<title>SB Admin - Bootstrap Admin Template</title>
<!-- Auth0Lock script -->
<script src="//cdn.auth0.com/js/lock-9.1.min.js"></script>
<!-- Bootstrap Core CSS -->
<link href="/ui/css/bootstrap.min.css" rel="stylesheet" />
<!-- Custom CSS -->
<link href="/ui/css/sb-admin.css" rel="stylesheet" />
<!-- Custom Fonts -->
<link href="/ui/font-awesome/css/font-awesome.min.css" rel="stylesheet" type="text/css" />
<!-- HTML5 Shim and Respond.js IE8 support of HTML5 elements and media queries -->
<!-- WARNING: Respond.js doesn't work if you view the page via file://-->
<!--[if lt IE 9]>
<script src="https://oss.maxcdn.com/libs/html5shiv/3.7.0/html5shiv.js"></script>
<script src="https://oss.maxcdn.com/libs/respond.js/1.4.2/respond.min.js"></script>
<![endif]-->
</head>
<body>
<div id="root">
</div>
<script src="/static/bundle.js"></script>
</body>
</html>
Mais pour une raison quelconque, après l'exécution de mnp début, il n'a pas d'accéder aux fichiers css.. donc j'obtiens une page sans style.
Voici l'arborescence de mon projet:
- actions
- composants
- conteneurs
- dist
- middleware
- node_modules
- réducteurs
- magasin
- de l'interface utilisateur
- --css
- --font-awesome
- index.html
- index.js
- webpack.config.js
- paquet.json
- Que voyez-vous dans l'onglet réseau?
- juste ceci: Warning: Unknown DOM propriété de classe. Vouliez-vous dire className? Mais il peut ne pas être associés à ce problème.
- Que voyez-vous dans l'onglet réseau?
Vous devez vous connecter pour publier un commentaire.
Si vous souhaitez inclure le css dans ton html, tu dois les mettre dans votre public dossier et utiliser '%PUBLIC_URL%", comme le chemin d'accès à votre css. Donc, il devrait ressembler à quelque chose comme ceci:
Alternativement, il est fortement recommandé que vous importez le fichier css que vous souhaitez à l'intérieur de votre réagissent composant, parce que votre css, serait d'obtenir minimisé et un forfait. Donc, vous pourriez faire quelque chose comme:
Pour plus d'informations, consultez la documentation ici.