基于node、webpack、搭建一个koa服务器
2023-09-11 14:19:39 时间
1、首先需要node(去官网下载)
2、见一个文件夹 比如koa cmd——r cd koa文件
3、npm init
4、安装webpack (本地安装)
npm install --save-dev webpack
4.1、用webpack4+ 还需要安装webpack-cli
npm install --save-dev webpack-cli
5、安装koa (记住,package.json内的项目名称不能叫koa 否则安装不了koa)
npm install koa --save
6、安装其他依赖
npm install koa-compress --save
npm install koa-router --save
npm install koa-compress --save
npm install koa-static --save
package.json文件
{
"name": "testKoa",
"version": "1.0.0",
"description": "",
"main": "index.js",
"scripts": {
"test": "echo \"Error: no test specified\" && exit 1",
"serve":"node app.js"
},
"author": "",
"license": "ISC",
"devDependencies": {
"webpack": "^4.31.0",
"webpack-cli": "^3.3.2"
},
"dependencies": {
"koa": "^2.7.0",
"koa-compress": "^3.0.0",
"koa-router": "^7.4.0",
"koa-static": "^5.0.0"
}
}
app.js
const Koa = require("koa");
const koaRouter = require("koa-router");
const koaStatic = require("koa-static");
const compress = require("koa-compress");
const path = require("path");
const fs = require("fs");
const app = new Koa();
app.use(compress());
app.use(koaStatic(path.resolve(__dirname,"./")));
const router = koaRouter();
router.get("*",async(ctx,next)=>{
ctx.type="html",
ctx.body=fs.readFileSync(path.resolve('./dist/index.html'),'utf-8')
});
app.use(router.routes()).use(router.allowedMethods());
app.listen(3000,()=>{
console.log("server run on localhost:3000");
})
将dist的文件放到跟目录
运行npm run serve
相关文章
- [转] Webpack-CommonsChunkPlugin
- vue - webpack.prod.conf.js
- 基于Node.js的Java虚拟机:node-jvm
- 【前端开发】Webpack mars3d-vue2-electron打包问题
- 【前端开发】Webpack electron打包--ValidationError: Invalid options object. Copy Plugin has been initialized using an options object that does not match the API schema
- 【Node】Webpack调试启动
- webpack(1)
- 【Webpack】webpack的基础使用详细总结 上(建议收藏)
- leaflet-webpack 入门开发系列五地图卷帘(附源码下载)
- webpack高级概念,使用 WebpackDevServer 实现请求转发一 (系列十四)
- webpack核心概念(系列二)
- 全栈开发实战|Vue进阶——使用静态模块打包工具webpack
- Web 前端 之 Webpack 的环境搭建,以及测试第一个webpack编译打包测试代码工程
- Karma 4 - Karma 集成 Webpack 进行单元测试
- 10天掌握webpack 5.0 .env文件
- Node的webpack打包的核心思想就是单页面富应用(SPA)
- webpack+vue起步