使用koa-static
中间件来处理Koa项目中的静态资源。
1.1 koa-static
安装:
npm install koa-static --save
1.2 koa-static
常用配置:
koa-static中间件接收两个参数——root
和opts
,代码如下:
const Koa = require('koa');
const path = require('path');
const static = require('koa-static');
const app = new Koa();
app.use(static(
path.join(__dirname, 'public'),{ //静态文件所在目录
maxage: 30*24*60*60*1000 //指定静态资源在浏览器中的缓存时间
}
));
通过上面的配置,在网页中的静态资源都会去/public
目录下去找,假设当前的项目目录结构为:
|——app.js
|——views
| |——index.html
|——public
| |——css
|——main.css
那么,在index.html
中引用main.css
文件:
<head>
<!--直接去/public目录下去找/css/main.css-->
<link rel="stylesheet" type="text/css" href="css/main.css">
</head>
<body>
<div class="box">这里是引用的外部样式</div>
</body>
</html>
在前期的项目中,使用koa-static
来配置Koa静态资源,后期将项目部署在服务器时,大部分是将静态资源通过Nginx
来配置。