1331333

.drone copy 2.yml

@@ -1,8 +1,91 @@
 kind: pipeline # 定义一个管道
 type: docker # 当前管道的类型
 name: test # 当前管道的名称
-steps: # 定义管道的执行步骤
-  - name: test # 步骤名称
-    image: node:latest # 当前步骤使用的镜像
-    commands: # 当前步骤执行的命令
-      - echo 测试drone执行
+
+steps:
+
+  # 第一步：构建项目
+  - name: 构建项目
+    image: node:18-alpine
+    commands:
+      - npm install
+      - npm run build
+    volumes:
+      - name: node_modules_cache
+        path: /drone/src/node_modules
+
+  # 第二步：上传静态资源到腾讯云COS (使用另一个插件)
+  - name: 静态资源上传到cos
+    image: ccr.ccs.tencentyun.com/xiaoqidun/gocos
+    settings:
+      secret_id:
+        from_secret: cos_secret_id
+      secret_key:
+        from_secret: cos_secret_key
+      bucket_url: https://files-1302416092.cos.ap-shanghai.myqcloud.com
+      source: dist
+      target: /test
+      strip_prefix: dist
+
+  # 第三步：部署到服务器
+  - name: 清除服务器缓存
+    image: appleboy/drone-ssh
+    settings:
+      host:
+        from_secret: server_host
+      username:
+        from_secret: server_username  
+      password:
+        from_secret: server_password
+      # 或者使用SSH密钥
+      # key:
+      #   from_secret: server_ssh_key
+      port: 22
+      script:
+        - rm -rf /www/wwwroot/show.zguiy.com/*
+        - mkdir -p /www/wwwroot/show.zguiy.com/
+        - chmod 755 /www/wwwroot/show.zguiy.com/
+    when:
+      branch: 
+        - main
+        - master
+        - dev
+
+  # 第四步：上传构建文件
+  - name: 上传构建文件
+    image: appleboy/drone-scp
+    settings:
+      host:
+        from_secret: server_host
+      username:
+        from_secret: server_username
+      password:
+        from_secret: server_password
+      # 或者使用SSH密钥
+      # key:
+      #   from_secret: server_ssh_key
+      port: 22
+      source: dist/*
+      target: /www/wwwroot/show.zguiy.com/
+      strip_components: 1
+    when:
+      branch:
+        - main
+        - master  
+        - dev
+
+# 定义数据卷用于缓存node_modules
+volumes:
+  - name: node_modules_cache
+    host:
+      path: /tmp/drone_cache/node_modules
+
+# 触发条件
+trigger:
+  branch:
+    - main
+    - master
+    - dev
+  event:
+    - push
+    - pull_request

.drone copy.yml

@@ -1,3 +1,90 @@
 kind: pipeline # 定义一个管道
 type: docker # 当前管道的类型
 name: test # 当前管道的名称
+
+steps:
+  # 第一步：构建项目
+  - name: 构建
+    image: node:18-alpine
+    commands:
+      - npm install
+      - npm run build
+    volumes:
+      - name: node_modules_cache
+        path: /drone/src/node_modules
+
+  # 第二步：上传静态资源到腾讯云COS (使用另一个插件)
+  - name: 上传到腾讯云
+    image: ccr.ccs.tencentyun.com/xiaoqidun/gocos
+    settings:
+      secret_id:
+        from_secret: cos_secret_id
+      secret_key:
+        from_secret: cos_secret_key
+      bucket_url: https://files-1302416092.cos.ap-shanghai.myqcloud.com
+      source: dist
+      target: /test
+      strip_prefix: dist
+
+  # 第三步：部署到服务器
+  - name: deploy
+    image: appleboy/drone-ssh
+    settings:
+      host:
+        from_secret: server_host
+      username:
+        from_secret: server_username  
+      password:
+        from_secret: server_password
+      # 或者使用SSH密钥
+      # key:
+      #   from_secret: server_ssh_key
+      port: 22
+      script:
+        - rm -rf /www/wwwroot/show.zguiy.com/*
+        - mkdir -p /www/wwwroot/show.zguiy.com/
+        - chmod 755 /www/wwwroot/show.zguiy.com/
+    when:
+      branch: 
+        - main
+        - master
+        - dev
+
+  # 第四步：上传构建文件
+  - name: upload
+    image: appleboy/drone-scp
+    settings:
+      host:
+        from_secret: server_host
+      username:
+        from_secret: server_username
+      password:
+        from_secret: server_password
+      # 或者使用SSH密钥
+      # key:
+      #   from_secret: server_ssh_key
+      port: 22
+      source: dist/*
+      target: /www/wwwroot/show.zguiy.com/
+      strip_components: 1
+    when:
+      branch:
+        - main
+        - master  
+        - dev
+
+# 定义数据卷用于缓存node_modules
+volumes:
+  - name: node_modules_cache
+    host:
+      path: /tmp/drone_cache/node_modules
+
+# 触发条件
+trigger:
+  branch:
+    - main
+    - master
+    - dev
+  event:
+    - push
+    - pull_request

.drone.yml

@@ -1,20 +1,29 @@
-kind: pipeline # 定义一个管道
-type: docker # 当前管道的类型
-name: test # 当前管道的名称
+kind: pipeline
+type: docker
+name: test
 
 steps:
-  # 第一步：构建项目
-  - name: build
+
+  - name: 构建项目
     image: node:18-alpine
     commands:
-      - npm install
-      - vite build
-    volumes:
-      - name: node_modules_cache
-        path: /drone/src/node_modules
+      - rm -rf node_modules
+      - npm ci
+      - npm run build
 
-  # 第二步：部署到服务器
-  - name: deploy
+  - name: 静态资源上传到cos
+    image: ccr.ccs.tencentyun.com/xiaoqidun/gocos
+    settings:
+      secret_id:
+        from_secret: cos_secret_id
+      secret_key:
+        from_secret: cos_secret_key
+      bucket_url: https://files-1302416092.cos.ap-shanghai.myqcloud.com
+      source: dist
+      target: /test
+      strip_prefix: dist
+
+  - name: 清除服务器缓存
     image: appleboy/drone-ssh
     settings:
       host:
@@ -23,21 +32,18 @@ steps:
         from_secret: server_username  
       password:
         from_secret: server_password
-      # 或者使用SSH密钥
-      # key:
-      #   from_secret: server_ssh_key
       port: 22
       script:
         - rm -rf /www/wwwroot/show.zguiy.com/*
         - mkdir -p /www/wwwroot/show.zguiy.com/
+        - chmod 755 /www/wwwroot/show.zguiy.com/
     when:
       branch: 
         - main
         - master
         - dev
 
-  # 第三步：上传构建文件
-  - name: upload
+  - name: 上传构建文件
     image: appleboy/drone-scp
     settings:
       host:
@@ -46,27 +52,19 @@ steps:
         from_secret: server_username
       password:
         from_secret: server_password
-      # 或者使用SSH密钥
-      # key:
-      #   from_secret: server_ssh_key
       port: 22
       source: dist/*
       target: /www/wwwroot/show.zguiy.com/
       strip_components: 1
-      rm: true
     when:
       branch:
         - main
         - master  
         - dev
 
-# 定义数据卷用于缓存node_modules
-volumes:
-  - name: node_modules_cache
-    host:
-      path: /tmp/drone_cache/node_modules
+# 移除 node_modules 缓存挂载
+# volumes: 已删除
 
-# 触发条件
 trigger:
   branch:
     - main

.drone1.yml

@@ -1,43 +0,0 @@
-kind: pipeline
-type: docker
-name: vite-build
-
-steps:
-  # 1. 安装依赖
-  - name: install dependencies
-    image: node:16
-    commands:
-      - npm install
-
-  # 2. 打包 Vite 项目
-  - name: build vite project
-    image: node:16
-    commands:
-      - vite build
-
-  # 3. 将构建产物上传到目标服务器
-  - name: deploy to server
-    image: appleboy/drone-ssh
-    settings:
-      host: 124.220.228.140  # 目标服务器地址
-      username: root        # 远程服务器用户名
-      password:
-        from_secret: ssh_password  # 从 Drone secrets 中获取 SSH 密码
-      port: 22              # SSH 端口
-      command_timeout: 5m   # 执行命令的超时设置
-    script:
-      - cd /home/docker/drone  # 进入构建目录
-      - rm -rf /www/wwwroot/show.zguiy.com/dist  # 删除旧的构建产物
-      - cp -r /workspace/dist /www/wwwroot/show.zguiy.com/dist  # 复制新的构建产物
-      - chmod -R 755 /www/wwwroot/show.zguiy.com/dist  # 设置目录权限
-      - systemctl restart nginx  # 重启 Nginx（如果使用 Nginx）
-
-volumes:
-  - name: build-output
-    host:
-      path: /home/docker/drone  # 本地构建目录
-
-trigger:
-  branch:
-    - master
-  event: [ push ]

.env.development

@@ -0,0 +1 @@
+VITE_PUBLIC = /

.env.production

@@ -0,0 +1 @@
+VITE_PUBLIC = https://cdn.files.zguiy.com/test/

README.md

@@ -3,4 +3,4 @@
 This template should help get you started developing with Vue 3 and TypeScript in Vite. The template uses Vue 3 `<script setup>` SFCs, check out the [script setup docs](https://v3.vuejs.org/api/sfc-script-setup.html#sfc-script-setup) to learn more.
 
 Learn more about the recommended Project Setup and IDE Support in the [Vue Docs TypeScript Guide](https://vuejs.org/guide/typescript/overview.html#project-setup).
-啊实打实打算豆腐干豆腐干和的风格和发
+啊实打实打算豆腐干豆腐干和的风格和发adas商店阿斯顿

package-lock.json

@@ -11,6 +11,7 @@
         "vue": "^3.5.13"
       },
       "devDependencies": {
+        "@types/node": "^24.0.3",
         "@vitejs/plugin-vue": "^5.2.3",
         "@vue/tsconfig": "^0.7.0",
         "typescript": "~5.8.3",
@@ -782,6 +783,16 @@
       "dev": true,
       "license": "MIT"
     },
+    "node_modules/@types/node": {
+      "version": "24.0.3",
+      "resolved": "https://registry.npmjs.org/@types/node/-/node-24.0.3.tgz",
+      "integrity": "sha512-R4I/kzCYAdRLzfiCabn9hxWfbuHS573x+r0dJMkkzThEa7pbrcDWK+9zu3e7aBOouf+rQAciqPFMnxwr0aWgKg==",
+      "dev": true,
+      "license": "MIT",
+      "dependencies": {
+        "undici-types": "~7.8.0"
+      }
+    },
     "node_modules/@vitejs/plugin-vue": {
       "version": "5.2.4",
       "resolved": "https://registry.npmjs.org/@vitejs/plugin-vue/-/plugin-vue-5.2.4.tgz",
@@ -1300,6 +1311,13 @@
         "node": ">=14.17"
       }
     },
+    "node_modules/undici-types": {
+      "version": "7.8.0",
+      "resolved": "https://registry.npmjs.org/undici-types/-/undici-types-7.8.0.tgz",
+      "integrity": "sha512-9UJ2xGDvQ43tYyVMpuHlsgApydB8ZKfVYTsLDhXkFL/6gfkp+U8xTGdh8pMJv1SpZna0zxG1DwsKZsreLbXBxw==",
+      "dev": true,
+      "license": "MIT"
+    },
     "node_modules/vite": {
       "version": "6.3.5",
       "resolved": "https://registry.npmjs.org/vite/-/vite-6.3.5.tgz",

package.json

@@ -5,17 +5,18 @@
   "type": "module",
   "scripts": {
     "dev": "vite",
-    "build": "vue-tsc -b && vite build",
+    "build": "vite build",
     "preview": "vite preview"
   },
   "dependencies": {
     "vue": "^3.5.13"
   },
   "devDependencies": {
+    "@types/node": "^24.0.3",
     "@vitejs/plugin-vue": "^5.2.3",
     "@vue/tsconfig": "^0.7.0",
     "typescript": "~5.8.3",
     "vite": "^6.3.5",
     "vue-tsc": "^2.2.8"
   }
-}
+}

src/App.vue

@@ -1,19 +1,16 @@
+<template>
+
+  <HelloWorld />
+</template>
+
+
 <script setup lang="ts">
 import HelloWorld from './components/HelloWorld.vue'
+const a="符合法1134353453311333规计划"
+
+
 </script>
 
-<template>
-  <div>
-    <a href="https://vite.dev" target="_blank">
-      <img src="/vite.svg" class="logo" alt="Vite logo" />
-    </a>
-    <a href="https://vuejs.org/" target="_blank">
-      <img src="./assets/vue.svg" class="logo vue" alt="Vue logo" />
-    </a>
-  </div>
-  sfgdfgdfhfgh
-  <HelloWorld msg="Vite + 高峰过后结双方的果很快ui哦山豆根豆腐干里噢批哦就将很快" />
-</template>
 
 <style scoped>
 .logo {

src/components/HelloWorld.vue

@@ -1,41 +1,27 @@
+<template>
+
+  <div> 
+    <img :src="url" alt=""/>
+    </div>
+</template>
 <script setup lang="ts">
-import { ref } from 'vue'
+import { onMounted, ref } from 'vue';
+
+let url=ref('')
+
+onMounted(()=>{
+  const publicPath = import.meta.env.VITE_PUBLIC;
+  console.log('环境变量 VITE_PUBLIC:', publicPath);
+  console.log('所有环境变量:', import.meta);
+  
+  url.value = publicPath + 'ui/背景.png'
+  console.log('1最终图片路径:', url.value);
+})
+
+
 
-defineProps<{ msg: string }>()
 
-const count = ref(0)
 </script>
 
-<template>
-  <h1>{{ msg }}</h1>
 
-  <div class="card">
-    <button type="button" @click="count++">count is {{ count }}</button>
-    <p>
-      Edit
-      <code>components/HelloWorld.vue</code> to test HMR
-    </p>
-  </div>
-
-  <p>
-    Check out
-    <a href="https://vuejs.org/guide/quick-start.html#local" target="_blank"
-      >create-vue</a
-    >, the official Vue + Vite starter
-  </p>
-  <p>
-    Learn more about IDE Support for Vue in the
-    <a
-      href="https://vuejs.org/guide/scaling-up/tooling.html#ide-support"
-      target="_blank"
-      >Vue Docs Scaling up Guide</a
-    >.
-  </p>
-  <p class="read-the-docs">Click on the Vite and Vue logos to learn more</p>
-</template>
-
-<style scoped>
-.read-the-docs {
-  color: #888;
-}
-</style>
+<style scoped></style>

tsconfig.app.json

@@ -2,12 +2,14 @@
   "extends": "@vue/tsconfig/tsconfig.dom.json",
   "compilerOptions": {
     "tsBuildInfoFile": "./node_modules/.tmp/tsconfig.app.tsbuildinfo",
+    "target": "ES2020",
+    "module": "ES2020",
+    "moduleResolution": "bundler",
 
     /* Linting */
     "strict": true,
     "noUnusedLocals": true,
     "noUnusedParameters": true,
-    "erasableSyntaxOnly": true,
     "noFallthroughCasesInSwitch": true,
     "noUncheckedSideEffectImports": true
   },

vite.config.ts

@@ -1,7 +1,47 @@
-import { defineConfig } from 'vite'
+import { defineConfig, loadEnv } from 'vite'
 import vue from '@vitejs/plugin-vue'
+import { resolve } from 'path'
 
-// https://vite.dev/config/
-export default defineConfig({
-  plugins: [vue()],
+export default defineConfig(({ mode }) => {
+  const env = loadEnv(mode, process.cwd());
+
+  return {
+    base: env.VITE_PUBLIC || './', //使用环境变量设置资源路径，默认为相对路径
+  
+    server: {
+      host: true,
+      port: 8080, //vite项目启动时自定义端口
+
+      open: true,
+      proxy: {
+        // 正则表达式写法
+        '^/api': {
+          target: 'http://192.168.3.151:3000/api', // 后端服务实际地址
+          changeOrigin: true, //开启代理
+          rewrite: (path) => path.replace(/^\/api/, '')
+        }
+      }
+    },
+
+    plugins: [
+      vue(),
+    ],
+
+    resolve: {
+      //别名
+      alias: {
+        '@': resolve(__dirname, './src'),
+        components: resolve(__dirname, './src/components'),
+        script: resolve(__dirname, './src/script'),
+        utils: resolve(__dirname, './src/utils'),
+        stores: resolve(__dirname, './src/stores')
+      }
+    },
+    build: {
+      assetsDir: 'static', //打包后的公共文件夹名
+      target: 'es2015',
+      cssTarget: ['chrome61'],
+      chunkSizeWarningLimit: 5000
+    }
+  }
 })