1.安装
npm install koa-static --save
2.引入
let static = require('koa-static');
3.配置
// 引入配置静态托管app.use(static(静态资源所放在的目录)可配置多个)
// app.use(static(__dirname,'static'));//方式一
// console.log(__dirname);//项目的路径
// app.use(static('./static'));//方式二
app.use(static(//方式三
path.join(__dirname,'static')
))
案例:
app_static.js
let Koa = require('koa');
let Router = require('koa-router');
let views = require('koa-views');
let app = new Koa();
let router = new Router();
let path = require('path');
// 引入koa-bodyparser插件
let bodyparser = require('koa-bodyparser');
// 配置中间件
app.use(bodyparser());
// 引入配置静态托管app.use(static(静态资源所放在的目录)可配置多个)
//http://localhost:3004/css/basic.css首先去static目录找,如果能找到就返回对应的文本,否继续next()
let static = require('koa-static');
// app.use(static(__dirname,'static'));//方式一
// console.log(__dirname);//项目的路径
// app.use(static('./static'));//方式二
app.use(static(//方式三
path.join(__dirname,'static')
))
//应用ejs模板引擎
app.use(views('views',{
extension:'ejs'
}))
router.get('/',async (ctx,next) => {
// ctx.body = '这是首页'
await ctx.render('post')
})
router.post('/doPost',async (ctx,next) => {
ctx.body = ctx.request.body;//获取post传过来的参数
})
app.use(router.routes());//启动路由
app.use(router.allowedMethods());
app.listen(3004);
views/static.html
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<meta http-equiv="X-UA-Compatible" content="ie=edge">
<title>Document</title>
<!-- 使用静态资源 -->
<link rel="stylesheet" href="/css/basic.css">
</head>
<body>
<!-- 使用静态资源 -->
<img src="/images/1.jpg" alt="">
</body>
</html>