小编ptr*_*dev的帖子

从节点模块在VueJS中提供firebaseui.css时出现问题

所以基本上我已经有很长时间了,以为我已解决了这个问题,但事实并非如此。

我从本指南开始开发网站,它帮助我使用vue-cli创建了PWA。

在向其中添加firebase身份验证时,我还使用了本指南将firebaseui添加到我的项目中。

它告诉我将此行添加到我的index.html

<link type="text/css" rel="stylesheet" href="node_modules/firebaseui/dist/firebaseui.css" />
Run Code Online (Sandbox Code Playgroud)

不幸的是,这没有解决,我在Chrome控制台中收到了以下错误消息:

Refused to apply style from 'http://localhost:8080/node_modules/firebaseui/dist/firebaseui.css'
 because its MIME type ('text/html') is not a supported stylesheet MIME type, and strict MIME checking is enabled.
Run Code Online (Sandbox Code Playgroud)

这是2个月前,在尝试找到临时解决方案之前,我尝试了很多方法来解决此问题:

当跟随指向CSS资源的链接时,我的浏览器中出现“无法获取/node_modules/firebaseui/dist/firebaseui.css”的提示,我认为本地服务器可能没有在提供此文件。

所以我进入了build / dev-server.js文件并添加了这一行:

app.use(express.static('node_modules'))
Run Code Online (Sandbox Code Playgroud)

并将index.html中的链接更改为:

<link type="text/css" rel="stylesheet" href="/firebaseui/dist/firebaseui.css" />
Run Code Online (Sandbox Code Playgroud)

现在,我的网站在运行“ npm run dev”时正确加载了所有firebaseui组件,但是现在在运行“ npm run build”时它仍然不执行此操作,因为我的服务器显示了以下内容:

"GET /firebaseui/dist/firebaseui.css" Error (404): "Not found"
Run Code Online (Sandbox Code Playgroud)

我想这是有道理的,因为我之前写下来是因为我以前只更改了dev-server.js中的代码,而不更改了与构建/生产相关的文件中的代码

基本上,我正在寻求一种使用firebaseui.css的方法,而不必更改dev-server.js中的内容以使其在生产中正常工作,或者有人告诉我必须编辑的build目录中的其他文件这行得通。

在此先感谢您,如果您需要查看更多我的代码,请提出要求,我将更新此帖子!

javascript node.js firebase vue.js vue-cli

2
推荐指数
1
解决办法
265
查看次数

标签 统计

firebase ×1

javascript ×1

node.js ×1

vue-cli ×1

vue.js ×1