Vercel部署Node.js Express项目
sunshj Lv4

Vercel是一个强大的网站托管服务

一、注册vercel

官网:https://vercel.com/

推荐用github直接登录注册,注册时会要求验证手机号。

二、安装vercel

本地安装 Vercel

1
npm i vercel -g

登录 Vercel

1
vercel login

三、创建Express项目

使用 express-generator 快速创建应用程序框架

  1. 安装express-generator

    1
    npm install -g express-generator
  2. 在当前工作目录中创建名为 myapp 的 Express 应用程序并将视图引擎将设置为ejs

    1
    express --view=ejs myapp
  3. 安装依赖

    1
    npm install

    生成的应用程序具有以下目录结构:

    1
    2
    3
    4
    5
    6
    7
    8
    9
    10
    11
    12
    13
    14
    15
    16
    17
    18
    19
    .
    ├── app.js
    ├── bin
    │ └── www
    ├── package.json
    ├── public
    │ ├── images
    │ ├── javascripts
    │ └── stylesheets
    │ └── style.css
    ├── routes
    │ ├── index.js
    │ └── users.js
    └── views
    ├── error.pug
    ├── index.pug
    └── layout.pug

    7 directories, 9 files
  4. 在根目录创建index.js,将bin/www里的代码复制到index.js中后即可删除bin目录,并对代码中导入的app模块路径进行修改;由于3000端口默认会被 Vercel 使用,所以 Express 服务要换个端口,在index.js中修改预设的3000端口

  5. 在package.json中的scripts下添加

    1
    "build": "node ./index.js"
  6. 下载 @vercel/node

    1
    npm i @vercel/node -S
  7. 在根目录创建vercel.json,写入以下配置

    1
    2
    3
    4
    5
    6
    7
    8
    9
    10
    11
    {
    "version": 2,
    "builds": [{
    "src": "index.js",
    "use": "@vercel/node"
    }],
    "routes": [{
    "src": "/(.*)",
    "dest": "/"
    }]
    }

四、部署 Node 服务

本地测试

1
vercel dev

部署服务

1
vercel

后续部署时会提示Deployed to production. Run vercel --prod to overwrite later,所以要更新应用(资源)

1
vercel --prod

五、使用模板

可以使用我的Express.js Starter快速创建支持vercel部署的Express + Prisma项目

 评论