vue打包完成之后,将dist部署在七牛云
-
安装七牛云 SDK
首先,你需要安装七牛云的 Node.js SDK。在你的项目目录中运行以下命令:
npm install qiniu --save
-
编写代码清空存储桶
以下是一个使用Node.js和
qiniu
SDK清空指定存储桶的示例代码:const qiniu = require('qiniu'); // 配置AK和SK const accessKey = '你的AccessKey'; const secretKey = '你的SecretKey'; const bucket = '你的存储桶名称'; // 初始化Auth对象 const mac = new qiniu.auth.digest.Mac(accessKey, secretKey); // 生成上传策略 const options = { scope: bucket, // 设置存储桶名称 }; const putPolicy = new qiniu.rs.PutPolicy(options); const uploadToken = putPolicy.uploadToken(mac); // 初始化对象存储管理对象 const config = new qiniu.conf.Config(); config.zone = qiniu.zone.Zone_z2; // 根据你的存储区域选择合适的区域配置,例如Zone_z2是华东区域 const bucketManager = new qiniu.rs.BucketManager(mac, config); // 清空存储桶的函数 function clearBucket() { bucketManager.listPrefix(bucket, null, function(err, respBody, respInfo) { if (err) { throw err; } if (respInfo.statusCode === 200) { const items = respBody.items; let deletePromises = []; // 存放删除操作promise的数组 items.forEach(item => { deletePromises.push(bucketManager.delete(bucket, item.key)); // 删除文件 }); // 等待所有删除操作完成 Promise.all(deletePromises).then(() => { console.log('所有文件已删除'); }).catch(err => { console.error('删除文件时发生错误', err); }); } else { console.log('获取文件列表失败', respInfo.toString()); } }); } // 调用清空存储桶函数 clearBucket();
-
配置七牛云上传
在你的项目中创建一个配置文件,比如qiniu.config.js
,并设置你的七牛云访问密钥和密钥等信息。例如:
module.exports = { accessKey: '你的AccessKey', secretKey: '你的SecretKey', bucket: '你的Bucket名称', origin: '你的域名', // 比如 cdn.yourdomain.com uploadDir: '你的上传目录' // 比如 'vue-app/' };
-
编写上传脚本
创建一个脚本来上传
dist
目录中的文件到七牛云。你可以在package.json
中添加一个脚本:"scripts": { "deploy": "node deploy.js" }
然后创建一个
deploy.js
文件,并编写以下代码:const qiniu = require('qiniu'); const config = require('./qiniu.config'); const path = require('path'); const fs = require('fs'); const glob = require('glob'); const { accessKey, secretKey, bucket, origin, uploadDir } = config; // 配置上传策略 const putPolicy = new qiniu.rs.PutPolicy({ scope: `${bucket}:${uploadDir}*` // 设置存储空间和目录 }); const uploadToken = putPolicy.uploadToken(accessKey, secretKey); // 创建表单上传对象 const formUploader = new qiniu.form_up.FormUploader(config); const config = new qiniu.conf.Config(); // 遍历 dist 目录下的所有文件并上传 glob('dist/**/*', null, function(er, files) { files.forEach(function(filepath) { // 构造上传函数 const key = path.join(uploadDir, path.relative('dist/', filepath)); // 生成上传到七牛的路径名 const localFile = filepath; // 本地文件路径 const extra = new qiniu.form_up.PutExtra(); formUploader.putFile(uploadToken, key, localFile, extra, function(respErr, respBody, respInfo) { if (respErr) { throw respErr; } if (respInfo.statusCode == 200) { console.log(key + ' is uploaded successfully.'); } else { console.log(key + ' upload failed:', respInfo.statusCode, respBody); } }); }); });
- 运行部署脚本
在终端中运行以下命令来部署你的应用
npm run deploy
做最好的自己,不努力永远看不到自己的光环。别在该努力的年纪享乐,就不会在该享乐的年纪吃苦!