Docker+daocloud realizes automatic construction and deployment of front-end projects

Automated project deployment is more commonly used in large companies or unicorns, and is more efficient than manual deployment of projects. Then this article combines the previously learned docker knowledge points and nginx to simply implement the automatic deployment of the VueJs project. Of course, it is similar for other projects.

Operating Environment

First, you need to install docker, nginx, node, etc. on the server. It is convenient for subsequent operations.

Pull the nginx image through docker, command docker pull nginx

Initialize a project through vue-cli

You can initialize a project through vue init webpack project name. Here, we assume that the project name is docker-vue, and then create a new Dockerfile file in the root directory of the project. The general content is as follows:

FROM nginx:latest
#Copy the html of the current packaged project to the virtual address COPY dist/ /usr/share/nginx/html/
#Use custom nginx.conf to configure ports and listeners RUN rm /etc/nginx/conf.d/default.conf
ADD default.conf /etc/nginx/conf.d/

RUN /bin/bash -c 'echo init ok!!!'

And create a default.conf file with the following content:

server {
# The port number defined in the project is listen 8080;
server_name localhost;

#charset koi8-r;
#access_log /var/log/nginx/log/host.access.log main;

location / {
  root /usr/share/nginx/html;
  index index.html index.htm;
}

#error_page 404 /404.html;

# redirect server error pages to the static page /50x.html
#
error_page 500 502 503 504 /50x.html;
location = /50x.html {
  root html;
}
}

Since then, the basic work has been completed. The next step is the basic configuration operation of daocloud.io

daocloud.io basic configuration operations

If you don't have an account, you can register at daocloud.io first.

The following operations are divided into:

• Create a project
• Cluster Management
• Create a mirror repository

Create a project

Here you need to add the project name, set the code source (can be github, gitlab), etc., and then select the project you need to build. I chose my own github repository docker-vue here, and then click Start Creating.

Cluster Management

The main purpose of cluster management is to connect to remote servers and create daocloud.io images through commands.

Select New Host

Since I purchased an Alibaba Cloud server myself and the system is Ubuntu, I chose this configuration and ran it on the server:

curl -sSL https://get.daocloud.io/daomonit/install.sh | sh -s e2fa03ebead51076411388c26dff2257dae89768

To build a docker image, such as:

The host is created successfully, as shown in the following figure:

Create a mirror repository

Enter [Image Warehouse], select the image you just built manually, and deploy the latest version to the free host or cloud test environment

Then make the following application settings:

After the deployment is complete, you can access it through the server IP + the container port number just set.

In this way, we have completed most of the operations. By looking at the docker container, we can see that after we successfully created the image repository, a container was automatically created:

The above is the full content of this article. I hope it will be helpful for everyone’s study. I also hope that everyone will support 123WORDPRESS.COM.