chore(ci): Setup CI/CD via Github Actions

Author: yvhr

.github/workflows/ci.yml

@@ -0,0 +1,20 @@
+name: CI
+
+on:
+  push:
+    branches: [master]
+  pull_request:
+    branches: [master]
+
+jobs:
+  build:
+    runs-on: ubuntu-latest
+    steps:
+      - uses: actions/checkout@v4
+      - uses: actions/setup-node@v4
+        with:
+          node-version: 20
+          cache: npm
+      - run: npm ci
+      - run: npm test
+      - run: npm run build

.github/workflows/publish.yml

@@ -0,0 +1,46 @@
+name: Publish
+
+on:
+  push:
+    tags: ['v*']
+
+permissions:
+  id-token: write
+  contents: write
+  packages: write
+
+jobs:
+  publish:
+    runs-on: ubuntu-latest
+    steps:
+      - uses: actions/checkout@v4
+
+      - uses: actions/setup-node@v4
+        with:
+          node-version: 24
+          cache: npm
+
+      - run: npm ci
+      - run: npm test
+      - run: npm run build
+
+      - name: Publish to npm
+        run: npm publish --provenance --access public
+
+      - name: Pack tarball
+        run: npm pack
+
+      - name: Create GitHub Release
+        uses: softprops/action-gh-release@v2
+        with:
+          generate_release_notes: true
+          files: '*.tgz'
+
+      - name: Publish to GitHub Packages
+        run: |
+          echo "//npm.pkg.github.com/:_authToken=${NODE_AUTH_TOKEN}" > ~/.npmrc
+          echo "@josephharveyangeles:registry=https://npm.pkg.github.com" >> ~/.npmrc
+          sed -i 's/"name": "vue-animate-onscroll"/"name": "@josephharveyangeles\/vue-animate-onscroll"/' package.json
+          npm publish --access public
+        env:
+          NODE_AUTH_TOKEN: ${{ secrets.GITHUB_TOKEN }}

.github/workflows/release.yml

@@ -0,0 +1,41 @@
+name: Release
+
+on:
+  workflow_dispatch:
+    inputs:
+      version:
+        description: 'Version number (e.g. 3.0.0)'
+        required: true
+        type: string
+
+permissions:
+  contents: write
+
+jobs:
+  release:
+    runs-on: ubuntu-latest
+    steps:
+      - uses: actions/checkout@v4
+
+      - uses: actions/setup-node@v4
+        with:
+          node-version: 20
+          cache: npm
+
+      - name: Configure git
+        run: |
+          git config user.name "github-actions[bot]"
+          git config user.email "41898282+github-actions[bot]@users.noreply.github.com"
+
+      - name: Bump version
+        run: npm version "${{ inputs.version }}" --no-git-tag-version
+
+      - run: npm ci
+      - run: npm test
+
+      - name: Commit, tag, and push
+        run: |
+          git add package.json package-lock.json
+          git commit -m "chore(release): v${{ inputs.version }}"
+          git tag "v${{ inputs.version }}"
+          git push && git push --tags

README.md

@@ -1,4 +1,8 @@
 # vue-animate-onscroll
+
+[![Publish](https://github.com/josephharveyangeles/vue-animate-onscroll/actions/workflows/publish.yml/badge.svg)](https://github.com/josephharveyangeles/vue-animate-onscroll/actions/workflows/publish.yml)
+[![Netlify Status](https://api.netlify.com/api/v1/badges/53a7ee61-bc19-43cf-9544-02cac57ff3fd/deploy-status)](https://app.netlify.com/projects/vue-animate-onscroll/deploys)
+
 A simple Vue 3 directive that animates elements as they scroll into view.
 
 ## Installation

mise.toml

@@ -1,2 +1,18 @@
 [tools]
 node = "22"
+
+[tasks.publish]
+description = "Bump version, test, commit, tag, and push to trigger publish"
+run = """
+#!/usr/bin/env bash
+set -euo pipefail
+VERSION="${1:?Usage: mise run publish <version>}"
+npm version "$VERSION" --no-git-tag-version
+npm ci
+npm test
+git add package.json package-lock.json
+git commit -m "chore(release): v$VERSION"
+git tag "v$VERSION"
+git push && git push --tags
+echo "Released v$VERSION — publish workflow will run on GitHub"
+"""

package.json

@@ -23,7 +23,7 @@
   "author": "yev",
   "repository": {
     "type": "git",
-    "url": "https://github.com/josephharveyangeles/vue-animate-onscroll"
+    "url": "https://github.com/yvhr/vue-animate-onscroll"
   },
   "keywords": [
     "vue",

vite.config.ts

@@ -13,6 +13,7 @@ export default defineConfig({
     rollupOptions: {
       external: ['vue'],
       output: {
+        exports: 'named',
         globals: {
           vue: 'Vue',
         },