前端实践项目(四)使用koa搭建开发环境
目录
该系列的总目录, https://www.cnblogs.com/shadoll/p/14637373.html
一.说明
开启前端服务的开发工具很多,上一篇就使用了webpack-dev-server,但它的编译文件会存放在内存中,有可能造成电脑卡顿。
本文使用koa来开启服务。koa是一个在nodejs中的轻量级web开发框架,它提供了丰富的函数及中间件可以使用,上手十分容易。
二.安装和配置
执行命令,安装插件。
cnpm install koa@2.3.0 --save-dev cnpm install koa-static@3.0.0 --save-dev
创建app.js。
//引用 const Koa = require('koa'); const koaStatic = require('koa-static'); const path = require('path'); //创建koa对象 const app = new Koa(); //使用static中间件,用于托管静态文件。通过url地址可以直接读取静态文件 app.use(koaStatic(path.join(__dirname, './dist'))); const port = 8222; //开启服务 app.listen(port, () => { console.log(`Listening on http://localhost:${port}`); });
三.使用
通过webpack来编译项目,打包的内容用koa开启服务来访问。输入下面的命令,编译和开启服务,在浏览器打开localhost:8222就可以查看页面了。
webpack
node app.js