資源被解釋為樣式表，但使用 MIME 類型 text/javascript 傳輸

Question

我使用 MVC、Java Script、JQuery、Ajax 創建了一個應用程序。 當我使用 Visual Studio 進行調試時，它運行良好，沒有任何腳本錯誤。 當我在 IIS 服務器上托管我的應用程序時，它顯示控制台錯誤並且我的應用程序樣式無法正常工作。 我附上了下面的錯誤。

錯誤：資源被解釋為樣式表，但使用 MIME 類型文本/javascript 傳輸：

圖片：

Answer 1

我遇到了完全相同的問題，由以下形式的 HTML 中的行引起：

<link rel="stylesheet" type="text/css" href="css/my_css_resource.css" />

當我從標簽中刪除rel="stylesheet"時，問題得到了解決。

Answer 2

由於代表人數少，我無法發表評論，但這非常重要。

答案說：

“我遇到了完全相同的問題，由以下形式的 HTML 中的行引起：

<link rel="stylesheet" type="text/css" href="css/my_css_resource.css" />

當我從標簽中刪除 rel="stylesheet" 時，問題得到了解決。”

是非常錯誤的。 rel="stylesheet" 告訴瀏覽器這是一個 css 文件。 沒有它，瀏覽器不知道如何處理 CSS 文件，並且其中的任何設計代碼都不會被執行。

我通過從我的 html 文件中刪除所有出現的 rel="stylesheet" 來確認這一點：結果是一個完全“裸”的頁面，絕對沒有任何設計。 我已經鏈接了 bootstrap css 和我自己的非空 css，並在刪除 rel="stylesheet" 之前對其進行了測試，以查看樣式實際上是由它們修改的。

Mime 類型由文件的發送者設置，在本例中為 Web 服務器。 錯誤消息表示服務器以純文本形式發送的文件被瀏覽器解釋為 CSS。 在這種情況下，問題出在服務器上，而不是在瀏覽器中。 瀏覽器正確地將此 CSS 文件解釋為樣式表。 服務器應該發送了正確的 mime 類型。

再次，我很抱歉我將此作為答案發布，即使它不是，但由於代表較低，我無法發表評論。 如果版主正在閱讀此內容並希望將其刪除，請將其發布為相關答案的評論，或者如果可能，將答案標記為錯誤，以免人們因此而受苦。

Answer 3

我意識到使用我的新 Windows 10 機器時，我無法在本地 IIS 中啟用靜態內容。 為此，請從控制面板轉到“打開或關閉 Windows 功能”，然后導航到以下位置：

確保選中此“靜態內容”選項。 然后，以管理員身份打開命令窗口並執行 iisreset。

轟，固定。

Answer 4

我遇到了同樣的問題，這是由於使用錯誤的方法來創建包。 我不小心復制了一個腳本包代碼並用 CSS 替換了它。 確保對 CSS 使用Style Bundle，對 JS 使用Script Bundle。 與渲染時相同。 樣式.Render() 和腳本.Render()。

我有這個：

bundles.Add(new ScriptBundle("~/bundles/bootstrap-core-css").Include("~/Content/themes/bootstrap/css/bootstrap.min.css"));

我改為：

bundles.Add(new StyleBundle("~/bundles/bootstrap-core-css").Include("~/Content/themes/bootstrap/css/bootstrap.min.css"));

我希望這有幫助。

Answer 5

我現在遇到了同樣的錯誤，我發現服務器上不存在 css 文件，因此，它返回了 404 頁面。

所以，你需要驗證css的鏈接。

資源被解釋為樣式表但使用 MIME 類型 text/javascript 傳輸

上面的消息可以解釋為：

您請求了一個 css 文件，但我們正在向您發送一個 javascript 文件。

如果你要開始調試，我認為你應該從確保文件的來源開始。

我希望這可以幫助別人。

Answer 6

是的，我也看到了這個問題...這個問題是因為在 .htaccess 中你添加了 RewriteRule ...所以你必須更改 css 文件目錄然后它會修復

Answer 7

我也遇到了 CRA 應用程序的這個問題。 我剛剛清除了我的瀏覽器數據，這似乎解決了這個問題。 可能是某些緩存文件導致了這種情況。

在清除瀏覽器數據之前，我在 edge 和 firefox 上檢查了相同的構建並且它按預期工作。

錯誤：資源被解釋為樣式表，但使用 MIME 類型 text/html 傳輸：“https://abcxyz.com/static/css/2.0ce10a16.chunk.css”。

Answer 8

另一種可能性是，如果您的 web.config 文件中有一個小寫的重寫規則，類似於：

<rule name="LowerCaseRule1" stopProcessing="true">
    <match url="[A-Z]" ignoreCase="false" />
    <action type="Redirect" url="{ToLower:{URL}}" />
</rule>

如果包含這種類型的規則，則需要確保所有腳本和樣式表鏈接都是小寫的。 如果不是，您可能會看到此警告。

Answer 9

我有一個使用Docker的Angular 6項目，但遇到了這個錯誤。 我在這里嘗試了許多明智的解決方案，但沒有一個對我有用。 我以各種方式對此錯誤進行了研究。 根據這里的答案，我已將其添加到我的nginx.conf文件中，如下所示。

我的nginx.conf文件已更改為以下內容：

http
{
    # The line added.
    include /etc/nginx/mime.types;

    server {
        listen 80;
        listen [::]:80;
        server_name _;
        ...
    }
    ...
}

添加后，我的問題解決了，項目成功運行。 我希望這個答案能幫助那些正在尋找問題答案的人。

Answer 10

我使用反應，得到同樣的錯誤，我通過在鏈接標簽中刪除 type="text/css" 來修復，沒有錯誤，我驗證了 css 真的被下載了。

如果刪除 rel="stylesheet"，沒有錯誤，但是 css 甚至不會下載，所以這不是解決方案，這是一個陷阱

        <link href="../src/css/gps/sidenav.css" rel="stylesheet" />