鏈接供css文件反應指數

我有這個簡單的指標：鏈接供css文件反應指數

<!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>

但由於某些原因，NPM運行開始後，它不會進入css文件..所以我得到一個頁面沒有風格。這裏是我的項目的樹：

行動
組件
容器
DIST
中間件
node_modules
減速
店
UI
--css
--font - 真棒
的index.html
index.js
webpack.config.js
的package.json

來源

2017-06-22 Remis07

你在網絡標籤中看到了什麼？ – SLaks

只是這個：警告：未知的DOM屬性類。你的意思是className？但它可能與這個問題沒有關係。 – Remis07

你在_network tab_中看到了什麼？ – SLaks

如果你想在你的html中包含css，你必須把它們放在你的public文件夾中，並使用'％PUBLIC_URL％'作爲你的css的路徑。因此，這將是這個樣子：

<link href="%PUBLIC_URL%/bootstrap.min.css" rel="stylesheet" />

另外，強烈建議您導入你希望你的反應組件內部的CSS，因爲你的CSS會得到微細化以及捆綁。所以你可以這樣做：

import React, { Component } from 'react'; 
// ... rest of imports 
import './path/to/css/font-awesome.min.css'

欲瞭解更多信息，請參閱文檔here。

來源

2017-06-22 14:35:15

鏈接供css文件反應指數

回答

相關問題