May 27, 2021 Web Cloud Development and Web Hosting Learning Guide
The first thing I learned about Noxt was that it felt really fragrant after using it under the vue SSR. Y ou can save the time for routing, and Nuxt.js reads all the .vue files in the directory and automatically generates the corresponding routing configuration, further encapsulates Vuex, and so on. H ere's how to deploy Noxt to static hosting?
Tencent CloudBase (TCB) is an all-in-one back-end cloud service with a serverless architecture that eliminates the hassle of server build and operation in mobile application building. At the same time, cloud development provides static hosting, command-line tools (CLI), Flutter SDK and other capabilities greatly reduce the threshold for application development.
Environmental requirements
Tool preparation
Install noxt scaffolding
npm i create-nuxt-app
Install the cloud development command tool CLI
npm i -g @cloudbase/cli
To test whether the cloudbase/cli was successfully installed, you can use the cloudbase or tcb command
cloudbase -v
Or
tcb -v
npx create-nuxt-app demo
npm run generate
file under the command line
First we turn on cloud development
Choose or create your own cloud development environment
Note here that the selection is a metered model (static site hosting can only be opened on a metered bill).
The environment is automatically initialized after successful creation (this process takes approximately 2 to 3 minutes).
After the initialization was successful, we went into the corresponding environment to find static site hosting and started using it
Wait for the static website service to be initialized before you can use it
Next we can transfer the static site of noxt to the static site hosting of cloud development.
The login command is executed first
tcb login
Authorize on the pop-up page
Next, deploy static sites to cloud development static site hosting
Here we deploy all the files under the dist folder to static site hosting to execute commands
tcb hosting:deploy folder -e cloud environment ID
The folder here is where all the files under this folder are deployed to the root of the cloud development, and the cloud environment ID can be viewed under the environment ID
Because we want to deploy all the files under dist, the command above can be written
tcb hosting:deploy ./dist -e demo-1cdbae
After the successful upload, we will find that there are many more files in the static site hosting
So how do we browse?
Cloud development provides a default domain name corresponding to the environment that can be accessed through this default domain name.
So our Noxt is deployed successfully
However, the default domain name has a limit down speed of 10KB/S, and if used formally, you need to add a domain name that has already been filed
and add dns resolution to it
If you can ping through this CNAME can be accessed using their own domain name