使用Angular和Deno的浏览器中的CSS MIME不匹配
米兰腾克
我正在设置Angular-Deno堆栈概念证明。对于Angular应用程序生成，使用@angular/cli版本9.1.9。生成应用程序后，我使用创建一个生产版本，npm run build -- --prod输出在dist应用程序的文件夹中。
deno服务器代码如下：
import { Application } from "https://deno.land/x/[email protected]/mod.ts";
const app = new Application();
app.static("/", "./client/dist/client");
app.file("/", "./client/dist/client/index.html");
app.start({ port: 8080 });
路径正确，内置的Angular应用位于中./client/dist/client。
当我使用deno run --allow-net --allow-read .\server.ts命令启动服务器并在浏览器中导航到` http：// localhost：8080 / url时，将下载Angular应用程序。一切正常。
但是，浏览器控制台上有一个警告：
Resource interpreted as Stylesheet but transferred with MIME type text/plain
我检查了index.htmlAngular应用程序的生成，并且CSS参考如下：
<link rel="stylesheet" href="styles.09e2c710755c8867a460.css"></head>
如果我将以上更改<link>为
<link type="text/css" href="styles.09e2c710755c8867a460.css"></head>
则说明一切正常，警告从浏览器控制台中消失。
有没有一种方法可以生成index.htmlAngular应用，使其包含<link>上面第二种方法的条目？还是deno请求管道中是否存在可以处理<link>Angular应用程序最初生成的条目并正确设置CSS MIME的配置？
我想避免使用自定义<link>的生成后脚本来更改生成的html的条目。
马科斯·卡萨格兰德
该link标签是正确的，但该abc框架没有设置正确Content-Type的头css文件，其实static中间件不设置Content-Type在所有的任何文件类型。
要解决此问题，您可以Content-Type使用中间件来设置自己，也可以使用已内置该功能的框架。您可以使用Oak。
import { Application, send } from "https://deno.land/x/oak/mod.ts";
const app = new Application();
app.use(async (context) => {
await send(context, context.request.url.pathname, {
root: `${Deno.cwd()}/client/dist/client`,
index: "index.html",
});
});
await app.listen({ port: 8080 });
本文收集自互联网，转载请注明来源。
如有侵权，请联系[email protected] 删除。
编辑于
相关文章
Related 相关文章
- 1
SEC7113：由于mime类型不匹配，CSS被忽略
- 2
Django CSS / JS MIME类型（“ text / html”）不匹配错误
- 3
Bash：文件计数和相应的mime类型不匹配
- 4
导航按钮在不同的浏览器中不匹配
- 5
对 json 的 urllib 请求与浏览器中的 json 不匹配
- 6
在浏览器中重新加载CSS而不刷新
- 7
如何解决“ MIME类型不匹配错误”，该问题阻止了我的Google Apps脚本中AJAX请求的资源？
- 8
模块版本与无头浏览器和桌面节点不匹配
- 9
由于事务量大，在SQL浏览器和Java JDBC中计数不匹配
- 10
模块版本与无头浏览器和桌面节点不匹配
- 11
DST 在旧日期的浏览器之间不匹配
- 12
CSS在Django admin中不起作用：由于MIME类型（“ text / html”）不匹配（X-Content-Type-Options：nosniff），[css文件url]中的资源被阻止
- 13
grep不匹配和匹配
- 14
不匹配和匹配问题
- 15
指定MIME类型和不指定MIME类型之间的区别？
- 16
令牌不匹配异常，如果长时间在浏览器中打开表单
- 17
在Cordova / ionic / Angular中使用本地json文件。在浏览器中工作，但在设备上不工作？
- 18
使用OR时不匹配
- 19
如何在浏览器中显示多部分MIME
- 20
CSS背景渐变在浏览器中滚动时不覆盖背景
- 21
当浏览器缩小时，如何使用CSS制作一行不包装的盒子？
- 22
使用锚导航而不更改浏览器 url 和 javascript
- 23
Gulp浏览器同步不监视和注入文件
- 24
Grep显示匹配和不匹配
- 25
匹配和不匹配的MySQL更新表
- 26
在将文件传递给gulp中的浏览器时，请使用全局匹配
- 27
mysql匹配不匹配括号中的文本
- 28
匹配函数与公式中的数字不匹配
- 29
使用QML和QtQuick2时如何在另一个.js文件中包含.js文件？不涉及浏览器
我来说两句