Vercel部署Node.js Express项目
sunshj Lv4

Vercel 是一个强大的网站托管服务 <!--more-->

一、注册 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
    12
    13
    14
    15
    {
    "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
 评论