Creating vite vue ts template: Setup Github Actions

Configure Github Actions for bulid

1. Let start by setting up Node.js workflow.

2. Go to Actions tab in your project and find Node.js workflow.
   

   (it may be hidden under More continuous integration workflows...)
   
   and press Set up this workflow button.

3. Rename node.js.yml to build.yml. Commit build.yml with Start commit button. Add Create .github/workflows/build.yml commit message.
   

On commit pre-commit.ci may fail because of prettier formatting.

1. git pull
2. pre-commit run --all-files
3. git add -u
4. git commit -m 'fix: prettier formating'

Update .github/workflows/build.yml

1. We do not have tests yet and build is present in package.json
   

          - run: npm ci
   -      - run: npm run build --if-present
   -      - run: npm test
   +      - run: npm run build
   

2. git add -u

3. git commit -m 'do not run npm test for build workflow'

Add badge

1. Add ![build](https://github.com/<OWNER>/<REPOSITORY>/actions/workflows/build.yml/badge.svg) to README.md. From docs

   You reference the workflow by the name of your workflow file.

   ![example workflow](https://github.com/<OWNER>/<REPOSITORY>/actions/workflows/<WORKFLOW_FILE>/badge.svg)
   

1. git add -u
2. git commit -m 'add build workflow badge'

Links

• https://docs.github.com/en/actions
• https://docs.github.com/en/actions/guides/setting-up-continuous-integration-using-workflow-templates
• https://github.com/actions/setup-node
• https://github.com/actions/starter-workflows/blob/main/ci/node.js.yml

Project

imomaliev / vue-ts

Vite + Vue + TypeScript template