一 node 环境的简单搭建
作为前端工程师, 学好 node 的重要性我就不多说了, 为了让自己对 node 更加了解, 也为了刚入门的萌新们可以更快的入门, 所以我将从 0 开始, 一步一步的搭建 node 环境
此次我搭建的只是纯后端, 项目采用前后端分离的模式, 前端页面我已经写好了, 传送门
有需要的同学可以下载并运行看看, 我也会一直更新这个项目, 觉得不错的可以点个星哦!
好了, 闲话少说, 开始今天的正题
1 创建文件夹
额我觉得这部分我就不说啥了
2 进入文件夹内部, 执行 npm init
我试用的编辑器是 vs code, 所以创建文件夹后按 ctrl + ~ 调出终端就可以输入了
如果你用的不是这个, 还可以进入文件夹内部后在地址栏输入 cmd 后回车即可继续编辑输入 npm init
如果有不知道 npm 是什么的同学 传送门 建议先学会并安装好了再来看本篇教程
执行 npm init 后会问你很多问题, 例如
图片
个人建议, 不用管它, 一路回车即可
3 创建 index.js
跟目录下创建 index.js, 作为整个后台项目的入口文件
4 安装 express 及重要插件
我在编写后台的过程中还是主要用 express 这个框架, 所以我这里也是给大家介绍的这种方式
终端分别输入
npm install express --save (注:--save 是保存到项目中的意思)
npm install body-parser --save (注: express 必要的中间件)
5 编写 index.js
- // 将一下内容拷进 index.js 中
- const path = require('path') // 引入当前路径
- const express = require('express') // 引入 express
- const bodyParser = require('body-parser')// 引入 body-parser
- const app = express();
- app.use(bodyParser.urlencoded({extended:true}));
- let _static = path.join('webapp'); // 定义静态文件的目录, 此处只为确认 node 环境运行了
- app.use(express.static(_static));
- app.listen(4000); // 监听端口
- console.log('服务器启动, 端口: 4000');
6 创建 webapp 文件夹, 并在文件夹内创建 index.html
- //index.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>
- </head>
- <body>
恭喜你成功了!
</body>
</html>
由此我们的 node 环境就算搭建完成了
终端运行 node index.js 看看什么样子吧!
成功界面
如果你看到了这个界面, 那么恭喜你成功的搭建了一个 node 环境
敲代码两分钟, 写博客 20 分钟不止, 盆友们, 写博客不易, 且行且珍惜啊!
欢迎广大网友批评指正, 有问题也可以随时问我哦!
后续我会不定期更新的
来源: http://www.jianshu.com/p/291e1fd247b7