代码片段 | 月空人

月空人的代码片段

这些是我在日常开发中使用的代码片段，你可以直接复制过去用！

该项目部署使用的 GitHub Actions

yml

name: deploy nuxt app
on:
  push:
    branches:
      - main
jobs:
  deploy:
    runs-on: ubuntu-24.04
    steps:
      - name: Checkout code
        uses: actions/checkout@v4

      - uses: pnpm/action-setup@v4
        name: Install pnpm
        with:
          # version: "9.x"
          run_install: false

      - name: Setup Node.js
        uses: actions/setup-node@v4
        with:
          node-version: 22.x
          cache: pnpm

      - name: Install dependencies
        run: pnpm install

      - name: Build the app
        run: pnpm run build

      - name: Deploy to Server
        uses: appleboy/scp-action@v1
        with:
          host: ${{ secrets.WXW_HOST }}
          username: ${{ secrets.WXW_USERNAME }}
          password: ${{ secrets.WXW_PASSWORD }}
          port: 22
          source: .output/
          target: ${{ secrets.WXW_TARGET }}

这里的 secrets 是在 GitHub 仓库的设置中配置的环境变量，确保你已经在仓库的 Secrets 中添加了 WXW_HOST, WXW_USERNAME, WXW_PASSWORD, 和 WXW_TARGET。这样配置后，每次你向 main 分支推送代码时，GitHub Actions 会自动触发部署流程，构建你的 Nuxt 应用并将其部署到指定的服务器上。你可以根据自己的需求调整 node-version 和其他配置项。

pnpm 工作区配置

pnpm-workspace.yamlyml

packages:
  - 'packages/*'
  - '!**/test/**'

pinia 常用

仓库配置

app.store.tsts

import { defineStore } from 'pinia'
import { ref } from 'vue'

export const useAppStore = defineStore('appStore', () => {
    const user = ref(null)

    return {
        user,
    }
})

使用

app.vuevue

<script setup lang="ts">
import { storeToRefs } from 'pinia'

import { useAppStore } from '@/store/app.store'

const appStore = useAppStore()
const { user } = storeToRefs(appStore)
</script>