問題重現:
vue-cli-service build
通過vue-cli-server build打包,將生成的dist目錄發佈到服務器,通過nginx代理訪問,發現樣式無效。
百度尋找解決方案,要麼是安裝css-loader加載器,要麼是修改config/index.js的assetsPublicPath爲./
但是我發現本地是正常的,並且測試服務器也是正常的。而且我的css文件是可以正常拉取的,所以並不是路徑的問題。在F12發現控制檯警告:
發現提示的很明顯, 就是瀏覽器渲染文件類型的時候出錯,應該是css文件來渲染,但是卻當成普通文件。
於是,查詢了一下Nginx配置發現缺少:
include mime.types;
加上,重啓nginx。完美。
備註:
include mime.types; #文件擴展名與文件類型映射表
default_type application/octet-stream #這是應用程序文件類型的默認值。