新增自动化部署

.github/workflows/deploy.yml

@@ -0,0 +1,35 @@
+name: deploy
+on:
+  push:
+    branches: [main] # main 分支有 push 时触发
+    paths-ignore: # 下列文件的变更不触发部署，可以自行添加
+      - README.md
+jobs:
+  deploy:
+    runs-on: ubuntu-latest
+    steps:
+      # 下载源码
+      # 这一步就是检出你的仓库并下载里面的代码到runner中,actions/checkout@v2是官方自己造的轮子，直接拿来用就行
+      - name: Checkout
+        uses: actions/checkout@v2
+
+      # 打包构建
+      - name: Build
+        uses: actions/setup-node@master
+        with:
+          node-version: "22.x"
+      - run: npm install # 安装依赖
+      - run: npm run docs:build # 打包
+
+      # 部署到 GitHub pages
+      - name: Deploy
+        uses: peaceiris/actions-gh-pages@v3 # 使用部署到 GitHub pages 的 action
+        with:
+          # 部署到 main 分支
+          branch: main
+          # deploy_key: ${{ secrets.ADMINPROCICD }} # 部署密钥，在项目的 Settings/Secrets 中配置
+          publish_dir: ./docs/.vitepress/dist # 部署目录
+          github_token: ${{ secrets.ADMINPROCICD }} # secret 名
+          user_name: ${{ secrets.MY_USER_NAME }}
+          user_email: ${{ secrets.MY_USER_EMAIL }}
+          commit_message: 自动部署 # 部署时的 git 提交信息，自由填写

.gitignore

@@ -1,6 +1,7 @@
 .DS_Store
 node_modules
 /dist
+/docs/.vitepress/dist
 
 # local env files
 .env.local

docs/.vitepress/config.mjs

@@ -7,18 +7,26 @@ export default defineConfig({
   themeConfig: {
     // https://vitepress.dev/reference/default-theme-config
     nav: [
-      { text: 'Home', link: '/' },
-      { text: 'Examples', link: '/markdown-examples' }
+      { text: '首页', link: '/' },
+      { text: '个人成长', link: '/column/vue/index' }
     ],
 
     sidebar: [
       {
-        text: 'Examples',
+        text: 'Vue2',
         items: [
-          { text: 'Markdown Examples', link: '/markdown-examples' },
-          { text: 'Runtime API Examples', link: '/api-examples' }
+          { text: 'options', link: '/column/vue/options' },
+          { text: 'computed', link: '/column/vue/computed' },
+          { text: 'watch', link: '/column/vue/watch' }
         ]
-      }
+      },
+      {
+        text: 'Vue3',
+        items: [
+          { text: 'composition-api', link: '/column/vue3/composition-api' },
+          { text: 'reactive', link: '/column/vue3/reactive' }
+        ]
+      },
     ],
     socialLinks: [
       { icon: 'github', link: 'https://github.com/IT-NuanxinPro/NuanXinPro-Notes' }

docs/markdown-examples.md → docs/column/vue/index.md

@@ -1,4 +1,4 @@
-# Markdown Extension Examples
+# 前端相关知识
 
 This page demonstrates some of the built-in markdown extensions provided by VitePress.
 

docs/index.md

@@ -3,23 +3,29 @@
 layout: home
 
 hero:
-  name: "NuanXinPro Notes"
+  name: "暖心のBlog"
   text: "Record daily front-end knowledge"
-  tagline: My great project tagline
+  tagline: 格子衬衫/互联网牛马/加班码农
+  image: 
+     src:/avatar.png
+     alt:avatar
   actions:
     - theme: brand
-      text: Markdown Examples
-      link: /markdown-examples
+      text: 进入主页
+      link: /column/vue/index
     - theme: alt
-      text: API Examples
-      link: /api-examples
+      text: 个人成长
+      link: /column/vue/index
 
 features:
-  - title: Feature A
-    details: Lorem ipsum dolor sit amet, consectetur adipiscing elit
-  - title: Feature B
-    details: Lorem ipsum dolor sit amet, consectetur adipiscing elit
-  - title: Feature C
-    details: Lorem ipsum dolor sit amet, consectetur adipiscing elit
+  - icon: 🐶
+    title: 前端开发
+    details: 拥有丰富的前端开发经验，熟练掌握HTML、CSS、JavaScript、ES6、Vue等前端开发技术
+  - icon: 🐻
+    title: Web性能优化
+    details: 熟练掌握Web性能优化，提升网站访问速度和用户体验
+  - icon: 🙍‍♂️
+    title: Ui设计
+    details: 熟练掌握UI设计、交互设计等
 ---