Templates 资源被解释为样式表，但使用MIME类型text/html进行传输："；http://localhost:4000/style.css"_Templates_Deno_Oak

Templates 资源被解释为样式表，但使用MIME类型text/html进行传输："；http://localhost:4000/style.css"

templates

Templates 资源被解释为样式表，但使用MIME类型text/html进行传输："；http://localhost:4000/style.css",templates,deno,oak,Templates,Deno,Oak,我用的是deno、oak和Denjuck。文件结构如下： index.html index.ts style.css 我使用的代码如下： index.ts是- import {Application, send} from "https://deno.land/x/oak/mod.ts"; import denjucks from "https://deno.land/x/denjucks/mod.js"; const app = new Application(); const HOST =

我用的是deno、oak和Denjuck。文件结构如下：

index.html
index.ts
style.css

我使用的代码如下： index.ts是-

import {Application, send} from "https://deno.land/x/oak/mod.ts";
import denjucks from "https://deno.land/x/denjucks/mod.js";
const app = new Application();
const HOST = "http://localhost";
denjucks.configure('', { autoescape: true });
const PORT = 4000;
let res = denjucks.render("index.html", {txt: "World"});
app.use(async (context) => {
  context.response.body = res;
  });

console.log(`Server started at: ${HOST}:${PORT}`);
await app.listen({ port: PORT });

index.html-

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <link rel="stylesheet" href="./style.css" type="text/css">
    <title>Document</title>
</head>
<body>
    <h1>{{txt}}</h1>
    <h1>Hello World</h1>
</body>
</html>

当我执行代码deno run--allow all index.ts时，在chrome开发者工具控制台中会出现一条警告消息-资源被解释为样式表，但使用MIME类型text/html传输：“。css代码不适用。

此错误背后的原因尚不清楚。

您的所有路由都提供

text/html

，因为您总是使用

denjucks.render（“index.html”，“txt:“World”}）进行响应

，因此当您请求

style.css

时，您将使用

index.html

您需要设置一个so

/style。css

可以正确提供

app.use(async (context) => {
  await send(context, context.request.url.pathname, {
    root: `${Deno.cwd()}`
  });
});

app.use(async (context) => {
   context.response.body = res;
});

当我使用avove代码时，在浏览器中不会打开任何页面。它给出消息-找不到此本地主机页找不到该网址的网页：HTTP错误404错误代码是什么？没有堆栈跟踪，就不可能帮助您。

app.use(async (context) => {
  await send(context, context.request.url.pathname, {
    root: `${Deno.cwd()}`
  });
});

app.use(async (context) => {
   context.response.body = res;
});