最近我們開發的百度小程序調用css失敗了，經過了一番的排查和調試，我們最終發現了問題所在，現在就來給大家分享一下我們的經驗。

//wxss樣式文件
.test {
color: red;
}

我們將上述樣式文件放在了工程目錄下的 `pages/index/index.wxss` 文件中。在頁面中使用如下代碼：

我是紅色字體

但是在小程序頁面中并沒有出現我們預期的紅色字體，而是默認的黑色字體。

經過一番排查，我們重新打開微信開發者工具，查看控制臺的信息。我們發現了一些異常輸出：

VM70:1   Refused to apply style from 'xxx/pages/index/index.wxss' 
because its MIME type ('text/html') is not a supported stylesheet MIME type, 
and strict MIME checking is enabled.

異常信息中提示了文件的 MIME 類型異常，這也是導致 CSS 樣式文件不能正確引入的原因。我們查看了一下服務器的文件類型，發現我們的服務器返回的文件類型是 `text/html`，而不是正確的 `text/css`。

我們在服務器上更新了返回的 MIME 類型為 `text/css`，再次運行小程序，CSS 樣式文件就被正確地加載取而使用了。

總結：當百度小程序調用 CSS 失敗時，我們應該先在微信開發者工具中查看控制臺的錯誤信息；如果是 MIME 類型異常導致樣式文件不能正確引入，需要在服務器上更新文件類型。