MIME类型错误Django / Python上的React项目

如何解决MIME类型错误Django / Python上的React项目

我以前使用过PythonAnywhere，但这是第一个利用Django后端和React前端的项目。奇怪的是，如果我在本地主机上运行此确切的项目，则完全没有问题。只有当我在PythonAnywhere上托管此网站时，才会出现此错误。

他们可能很难看...

Refused to apply style from 'http://bluebirdteaching.pythonanywhere.com/static/css/2.8aa5a7f8.chunk.css' because its MIME type ('text/html') is not a supported stylesheet MIME type,and strict MIME checking is enabled.

对此进行查找，我在this页上遇到了很多东西，但是我似乎无法理解那里提供的答案。我只是不明白为什么它可以在localhost上运行，而不能在PythonAnywhere上运行。

我包括了上面的图像，不仅是为了显示index.html，而且是为了显示项目目录，这是必要的，正如其他链接所解释的那样。如果我要寻找的答案是在另一篇文章中，那我就说不通了。

同样，当我在本地运行项目时，一切都按预期工作。当然，谢谢大家的帮助。我已经解决这个问题了一段时间了。任何帮助/解释都将是极大的缓解。

编辑：这是我执行npm run build时生成的index.html文件。这是所有chunk.css和chunk.js的引用。

<!doctype html>
<html lang="en">
    <head>
        <meta charset="utf-8"/>
        <link rel="icon" href="/favicon.ico"/>
        <meta name="viewport" content="width=device-width,initial-scale=1"/>
        <meta name="theme-color" content="#000000"/>
        <meta name="description" content="Web site created using create-react-app"/>
        <link rel="apple-touch-icon" href="/logo192.png"/>
        <link rel="manifest" href="/manifest.json"/>
        <title>BlueBird Teaching</title>
        <link href="/static/css/2.f3cffc9e.chunk.css" rel="stylesheet">
        <link href="/static/css/main.aa904fbe.chunk.css" rel="stylesheet">
    </head>
    <body>
        <noscript>You need to enable JavaScript to run this app.</noscript>
        <div id="root"></div>
        <script>!function(e){function r(r){for(var n,a,p=r[0],l=r[1],f=r[2],c=0,s=[];c<p.length;c++)a=p[c],Object.prototype.hasOwnProperty.call(o,a)&&o[a]&&s.push(o[a][0]),o[a]=0;for(n in l)Object.prototype.hasOwnProperty.call(l,n)&&(e[n]=l[n]);for(i&&i(r);s.length;)s.shift()();return u.push.apply(u,f||[]),t()}function t(){for(var e,r=0;r<u.length;r++){for(var t=u[r],n=!0,p=1;p<t.length;p++){var l=t[p];0!==o[l]&&(n=!1)}n&&(u.splice(r--,1),e=a(a.s=t[0]))}return e}var n={},o={1:0},u=[];function a(r){if(n[r])return n[r].exports;var t=n[r]={i:r,l:!1,exports:{}};return e[r].call(t.exports,t,t.exports,a),t.l=!0,t.exports}a.m=e,a.c=n,a.d=function(e,r,t){a.o(e,r)||Object.defineProperty(e,{enumerable:!0,get:t})},a.r=function(e){"undefined"!=typeof Symbol&&Symbol.toStringTag&&Object.defineProperty(e,Symbol.toStringTag,{value:"Module"}),Object.defineProperty(e,"__esModule",{value:!0})},a.t=function(e,r){if(1&r&&(e=a(e)),8&r)return e;if(4&r&&"object"==typeof e&&e&&e.__esModule)return e;var t=Object.create(null);if(a.r(t),Object.defineProperty(t,"default",value:e}),2&r&&"string"!=typeof e)for(var n in e)a.d(t,n,function(r){return e[r]}.bind(null,n));return t},a.n=function(e){var r=e&&e.__esModule?function(){return e.default}:function(){return e};return a.d(r,"a",r),r},a.o=function(e,r){return Object.prototype.hasOwnProperty.call(e,r)},a.p="/";var p=this.webpackJsonpreactapp=this.webpackJsonpreactapp||[],l=p.push.bind(p);p.push=r,p=p.slice();for(var f=0;f<p.length;f++)r(p[f]);var i=l;t()}([])</script>
        <script src="/static/js/2.f7026f3a.chunk.js"></script>
        <script src="/static/js/main.f2b0e582.chunk.js"></script>
    </body>
</html>

解决方案

之所以在本地运行而不在Heroku或PythonAnywhere上运行，是因为我需要为静态文件设置映射。从字面上看，我整个过程所需要做的就是python3 manage.py collectstatic。

解决方法

您链接到的SO帖子中的建议之一是，您实际上可能不是在使用CSS，而是在使用HTML。您是否已将CSS页面加载到浏览器中以查看从该URL返回的内容？

MIME类型错误Django / Python上的React项目

如何解决MIME类型错误Django / Python上的React项目

解决方法

相关推荐