VueJS编译的应用程序css不'；除非复制并粘贴回浏览器样式编辑器，否则无法工作_Css_Vue.js

VueJS编译的应用程序css不'；除非复制并粘贴回浏览器样式编辑器，否则无法工作

css vue.js

VueJS编译的应用程序css不'；除非复制并粘贴回浏览器样式编辑器，否则无法工作,css,vue.js,Css,Vue.js,我使用npm run build编译了一个vuejs应用程序，在firefox中查看结果时，CSS不会显示。它在“网络”选项卡中加载，并显示在样式编辑器下，但显示“0规则”。在开发中运行npm run service时，一切都可以正常加载如果复制样式文本并将其粘贴到自身上，则样式将正确加载这是我的应用程序的HTML <!DOCTYPE html> <html> <head> <meta charset=utf-8> <

我使用

npm run build

编译了一个vuejs应用程序，在firefox中查看结果时，CSS不会显示。它在“网络”选项卡中加载，并显示在样式编辑器下，但显示“0规则”。在开发中运行

npm run service

时，一切都可以正常加载

如果复制样式文本并将其粘贴到自身上，则样式将正确加载

这是我的应用程序的HTML

<!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">
    <link rel=icon href=/favicon.ico>
    <title>frontend</title>
    <link as=style href=/css/app.36bb3a4e.css rel=preload>
    <link as=style href=/css/chunk-vendors.baa7246e.css rel=preload>
    <link as=script href=/js/app.fcf42d91.js rel=preload>
    <link as=script href=/js/chunk-vendors.ea5cf647.js rel=preload>
    <link href=/css/app.36bb3a4e.css rel=stylesheet>
    <link href=/css/chunk-vendors.baa7246e.css rel=stylesheet>
</head>

<body><noscript><strong>We're sorry but frontend doesn't work properly without JavaScript enabled. Please enable it to continue.</strong></noscript>
    <div id=app></div>
    <script src=/js/app.fcf42d91.js></script>
    <script src=/js/chunk-vendors.ea5cf647.js></script>
</body>

</html>


前端
很抱歉，如果未启用JavaScript，前端无法正常工作。请使其继续。

是什么原因导致了这种情况，我如何修复它？

发现nginx使用的css文件的内容类型是

text/plain

，而不是

text/css

。添加

include/etc/nginx/mime.types

到

位置

块将其修复。

发现nginx正在为css文件提供内容类型为

text/plain

而不是

text/css

的服务。添加

include/etc/nginx/mime.types到位置
块修复它