VueCli3.x全栈项目- node-express搭建服务器

  1. 新建一个存放项目的文件夹
  2. cmd在控制台打开
    在这里插入图片描述
  3. npm init初始化项目
    说明:在node开发中使用npm init会生成一个pakeage.json文件,这个文件主要是用来记录这个项目的详细信息的,它会将我们在项目开发中所要用到的包,以及项目的详细信息等记录在这个项目中。方便在以后的版本迭代和项目移植的时候会更加的方便。也是防止在后期的项目维护中误删除了一个包导致的项目不能够正常运行。使用npm init初始化项目还有一个好处就是在进行项目传递的时候不需要将项目依赖包一起发送给对方,对方在接受到你的项目之后再执行npm install就可以将项目依赖全部下载到项目里
  4. 初始完成后,是这个样子的,从package nameIs this OK? (yes)的信息可填可不填,不填就一直按回车
    在这里插入图片描述
  • 信息填完后,可以输入ls,查看是否初始化成功,会出现package.json
    在这里插入图片描述
  • 然后可以执行code .,在vscode中打开项目(前提是安装了vscode),没有安装的可以把项目拖拽到自己的编译器里进行打开或者在编译器里打开文件
    在这里插入图片描述
  1. 在编译器的终端打开项目,输入touch server.js,创建入口文件。这个文件的名字跟项目初始化时填写的那个保持一致
  2. 安装express
    在这里插入图片描述
  3. server.js文件中引入express
const {
    
     request, response } = require("express");
const express = require("express");     //引入express
const app = express();                  //实例化一个app

//设置一个路由,访问服务器
app.get("/",(request,response) => {
    
    
    request.setEncoding("HELLO SEVER.JS!");
})

//设置一个端口号
const port = process.env.PORT || 5000;  //本地的服务器端口号一般是5000

app.listen(port,()=>{
    
    
    console.log('服务正在启动!');
})
  1. 在终端启动服务
//两种方法
1. node server.js
2. 安装nodemon
 - 好处:安装以后就不用没更改一次`server.js`,就用`node server.js`启动一次服务
 - 安装命令:npm i -g nodemon
 - 安装完成后,输入nodemon server.js,启动服务
 - 每次更改`server.js`后,只要保存,nodemon就会帮助我们重新启动服务
  • 可以在package.json中添加
"scripts": {
    "start": "node server.js",
    "server": "nodemon server.js" 	//添加这行命令后,就可以通过`npm run server`,来启动服务
  },
  1. 服务启动成功后,在浏览器输入地址http://localhost:5000/,就可以访问到服务器了

猜你喜欢

转载自blog.csdn.net/weixin_45663697/article/details/110704365