Edge Developer Platform
  • Pages
    • Product Introduction
    • Quick Start
      • Importing a Git Repository
      • Starting From a Template
      • Direct Upload
    • Framework Guide
    • Project Guide
      • Project Management
      • edgeone.json
      • Error Codes
    • Build Guide
    • Deployment Guide
      • Overview
      • Create Deploys
      • Manage Deploys
      • Deploy Button
    • Domain Management
      • Overview
      • Custom Domain Name
      • Configuring an HTTPS Certificate
      • How to Configure a DNS CNAME Record
    • Pages Functions
    • KV Storage
    • Edge AI
    • EdgeOne CLI
    • Pages MCP
    • Best Practices
      • 1-Minute Quick Deployment + Free Beta Test in Progress | Your Exclusive DeepSeek, Handled by EdgeOne!
      • Deploy WordPress Gatsby To EdgeOne Pages
      • Build an Ecommerce Platform Using WordPress + GatsbyJS
      • Combining Sanity to Deploy a Portfolio Template
    • Migration Guides
      • Migrating from Vercel to EdgeOne Pages
      • Migrating from Cloudflare Pages to EdgeOne Pages
      • Migrating from Netlify to EdgeOne Pages
    • FAQs
    • Contact Us
    • Release Notes
Unlock 1 Year of EdgeOne + 1TB CDN: Join Our Developer Journey
Get Started Now !

Migrating from Vercel to EdgeOne Pages

This guide will help you smoothly migrate your Vercel project to EdgeOne Pages.


1.Preparations: Search for the Build Command and Output Directory

First, we need to find the build command and output directory of your Vercel project:
1. Log in to the dashboard and find the project to migrate.
2. Enter Settings (project setting) and select the General (common) tab.
3. In the Build and Development Settings panel, record the following information:
3.1 Build Command
3.2 Output Directory



Example:
Build Command: npm run build
Output Directory: build

This information will be used in project settings.


2.Configuration Migration: Handle Redirects and Headers

If your project uses a vercel.json file to configure redirects or custom headers, you need to migrate these configurations to the edgeone.json file of EdgeOne Pages.

The following is a comparison example of both.

Vercel.json configuration
{
"redirects": [
{
"source": "/articles",
"destination": "/blog",
"statusCode": 301
}
],
"rewrites": [
{
"source": "/assets/*",
"destination": "/assets-new/:splat"
}
],
"headers": [
{
"source": "/(.*)",
"headers": [
{
"key": "X-Frame-Options",
"value": "DENY"
},
{
"key": "Cache-Control",
"value": "max-age=7200"
}
]
},
{
"source": "/assets/*",
"headers": [
{
"key": "Cache-Control",
"value": "max-age=31536000"
}
]
}
]
}

Corresponding edgeone.json configuration:
{
"redirects": [
{
"source": "/articles",
"destination": "/blog",
"statusCode": 301
}
],
"rewrites": [
{
"source": "/assets/*",
"destination": "/assets-new/:splat"
}
],
"headers": [
{
"source": "/*",
"headers": [
{
"key": "X-Frame-Options",
"value": "DENY"
},
{
"key": "Cache-Control",
"value": "max-age=7200"
}
]
},
{
"source": "/assets/*",
"headers": [
{
"key": "Cache-Control",
"value": "max-age=31536000"
}
]
}
]
}
Note: The configuration syntax of EdgeOne Pages is very similar to that of Vercel, but there may be some minor differences. For detailed configuration options, see edgeone.json documentation.


3.Function Migration: From Vercel to EdgeOne Pages

There are some differences in syntax and usage between the two platforms. Here is a simple comparison example:

Hello World of Vercel Functions
export const dynamic = 'force-dynamic';
export function POST(request) {
return new Response(`Hello world`);
}

Hello World of EdgeOne Pages Functions
export function onRequestPost(context) {
return new Response(`Hello world`);
}

Main Differences
Pages uses onRequest series functions (such as onRequestPost) to handle different HTTP methods.
Pages function receives a context object, which contains request information, environment variables.
The response method is similar. Both use Response object.

Migration suggestions:
Change Vercel's export functions to EdgeOne Pages' onRequest series functions.
If Vercel-specific features are used, you may need to find other solutions. Contact us through the community.

For detailed function usage, refer to Pages Functions Documentation.


4.Project Deployment: Create a New Project on EdgeOne Pages

After preparation work is completed, create and deploy a project on EdgeOne Pages:
1. Log in to Tencent Cloud Console and enter Pages service.
2. Click "Create Project" and select your GitHub repository.
3. In project configuration, fill in the build command and output directory recorded previously.
4. Click the "Start Deployment" button, and Pages will automatically build and deploy your project.


5.Domain Configuration: Adding a Custom Domain

Migration Steps
1. Add your custom domain in project settings and obtain the CNAME record value.
2. Log in to your DNS provider console.
3. Delete the A, AAAA or CNAME records previously set for Vercel.
4. Add a new CNAME record pointing to the new value provided by EdgeOne Pages.
5. Wait for DNS update to take effect (may take a few minutes to a few hours).

Note: If you previously used Vercel DNS, transfer the domain to another DNS provider, and then configure the CNAME record according to the above steps.

For the detailed domain addition process, refer to the Domain Management document.

By completing the above steps, you have successfully migrated your Vercel project to EdgeOne Pages. The two platforms have similarities in some aspects. On a strong infrastructure, we have optimized for Pages product features, such as intelligent refresh preheating, to provide an out-of-the-box experience. In addition, Pages has fewer restrictions compared to competitors during the public beta phase, providing more flexibility for developers. In terms of customer support, we provide more timely responses, committed to providing developers with a high-quality product experience.

If you encounter any issues during migration, please refer to the EdgeOne Pages Documentation.