Storybook

// todo..
Copy the code

github access tokens

Create access Tokens on Github

setting => Developer settings => Personal access tokens => Generate new token

Copy and save

Travis

travis-ci.org/

Go to Travis, associate Github with the project, and add Access Tokens in the project setting that requires CI/CD

Name the variable github_token(used later)

Configuration project file

Add.travis. Yml to the project root directory

language: node_js
node_js:
  - 'stable'
cache:
  directories:
    - node_modules
env:
  - CI=true

install:
  - yarn

script:
  - npm run build-storybook
deploy:
  provider: pages
  skip_cleanup: true
  github_token: $github_token
  local_dir: storybook-static
  traget-branch: docs
  on:
    branch: main
Copy the code

Among them

Github_token is the variable name you just set

Traget-branch is the branch that you want Travis to push automatically. If not, it defaults to gh-Pages

push

Once configured, push the project to the main branch and you can see that Travis automatically triggers deployment

You will see that Travis is automatically deployed to the DOSC branch

Configuration making page

Go to the project => Setting => Github Pages and set the DOSC branch and root path

done

When the Travis build fails, try recreating the Assess Token on Github and adding it back to the Travis Environment Variables

Demo:github.com/liujiapeng/…