Spent two weeks of my spare time using Github +vue to build a blog of my own, through issues comment function to achieve the blog login and comment, and open source it out. [www.kajie88.com] Blog source address: github.com/kajiecy/kaj…

The configuration is simple by simply changing the reserved fields in the Store. I’m going to show you how to get information.

If you think it is ok, your little STAR is my motivation to update!!

configuration

Required environment

  1. Create a github Pages library on Github (the library name must be your username.github.
  2. Create OAuth Apps (The comment feature requires us to create OAuth Apps for users to log in)

    If you already have a domain name, you can fill it in with your own domain name. This url is not actually used. We give control by passing redirectUri in the get request at login time

    Once you register, you’ll get ClientID and Secret directly into your configuration file.

Other configuration fields are described

Due to the first access through Github Pages, the server resources are limited and the speed is slow in foreign countries. Second, we only pass the code without pictures. All pictures are recommended to be put into the cloud server, the author with seven cattle, can also choose other.

The parameter name Parameters to describe
qiniuDomainName Cloud storage server BaseURL
defaultImg The default address of the blog (use the default image when a blog has no cover image for tags, categories, etc.)
aboutIssuesId The issuse numer for the page (iusses is also used for the page and issuseId is used for the page)
clientId Registered in the previous step
clientSecret Same as above (please do not upload clientSecret directly to Github because it will be detected and require you to regenerate -_-)
owner The user name
repo The library

Bind domain: If you want to change the CNAME file to your own domain name for your blog, otherwise delete it.

yarn insatll
vue-cli-service build
Copy the code

Blog Publishing rules

Labels

In addition to the tag to mark the post, I also set one :img tag to customize the cover title of the blog. In blogs: IMG is hidden from readers, when a post has more than one: IMG tag, the cover image is taken last. (characters after :img will be displayed by concatenating them with qiniuDomainName)

Milestones

The Description field becomes the cover image of the class blog. When using this field, please create a first renamed image to avoid unknown problems. Labels does not return Description fields in API.

Issues

Nothing can notice of happy write blog!!