tencent cloud

Overview

This document describes how to quickly deploy a local Nuxt.js SSR project to the cloud through an HTTP-triggered function.

Note：

This document mainly describes how to deploy in the console. You can also complete the deployment on the command line. For more information, see Deploying Framework on Command Line.

Prerequisites

Before using SCF, you need to sign up for a Tencent Cloud account and complete identity verification first.

Directions

Template deployment: Quick deployment of Nuxt.js project

1. Log in to the SCF console and click Functions on the left sidebar.
2. Select the region and namespace where to create a function at the top of the page and click Create to enter the function creation process.
3. Select Template, enter webfunc in the search box to filter function templates, select the Nuxt.js template, and click Next.
4. On the Create page, you can view and modify the specific configuration information of the template project.
5. Click Complete. After creating the HTTP-triggered function, you can view its basic information on the Function management page.
6. Click Trigger management on the left to view the access path and access your deployed Nuxt.js project as shown below:
   
7. Click the access path URL to access the Nuxt.js project as shown below:
   

   Note：

   As the Nuxt.js framework needs to be rebuilt before each deployment, be sure to update the code locally and run build again before deploying.

Custom deployment: Quick migration of local project to cloud

Prerequisites

The Node.js runtime environment has been installed locally.

Local development

1. Refer to Installation to install and initialize your Nuxt.js project:

   npx create-nuxt-app nuxt-app
   

2. In the root directory, run the following command to directly start the service locally.

   cd nuxt-app && npm run dev
   

3. Visit http://localhost:3000 in a browser, and you can access the sample Nuxt.js project locally as shown below:
   

Deployment in cloud

You need to make simple modifications to the initialized project, so that the project can be quickly deployed through an HTTP-triggered function. The project transformation here is usually divided into the following two steps:

• Add the scf_bootstrap bootstrap file.
• Change the listening address and port to 0.0.0.0:9000.

The detailed directions are as follows:

1. Create the scf_bootstrap bootstrap file in the project root directory and add the following content to it (which is used to start services and specify the bootstrap port):
   #!/var/lang/node12/bin/node
   require("@nuxt/cli")
       .run(["start", "--port", "9000", "--hostname", "0.0.0.0"])
       .catch(error => {
       require("consola").fatal(error);
       require("exit")(2);
       });

   Note

   • Here is only a sample bootstrap file. Adjust the specific operations according to your actual business scenario.
   • The sample uses the standard node environment path of SCF. When debugging locally, you need to change it to your local path.

2. After the creation is completed, you need to run the following command to modify the executable permission of the file. By default, the permission 777 or 755 is required for it to start normally. Below is the sample code:
   chmod 777 scf_bootstrap

3. Log in to the SCF console and click Functions on the left sidebar.
4. Select the region where to create a function at the top of the page and click Create to enter the function creation process.
5. Select Create from scratch and configure the options as prompted:
   • Function type: Select HTTP-triggered function.
   • Function name: Enter the name of your function.
   • Region: Enter your function deployment region, which is Guangzhou by default.
   • Runtime environment: Select Nodejs 12.16.
   • Submitting method: Select Local folder and upload your local project.
   • Function codes: Select the specific local folder where the function code is.
6. Click Complete.

   Note：

   When you access the URL, the access may fail due to frontend routing. Therefore, you need to remove the /release path when accessing.

Development management

After the deployment is completed, you can quickly access and test your web service in the SCF console and try out various features of SCF, such as layer binding and log management. In this way, you can enjoy the advantages of low cost and flexible scaling brought by the serverless architecture.