vue打包上傳到騰訊COS

1,  引入cos-nodejs-sdk-v5

npm i cos-nodejs-sdk-v5 --save

2，在build文件下創建uploadOSS.js

let COS = require('cos-nodejs-sdk-v5')

var fs = require('fs');

var delList = []

var bucket = 'myBucket'

var Region = 'myRegion'

let client = new COS({
	SecretId: 'mySecretId',
	SecretKey: 'mySecretKey',
});

//判斷當前字符串是否以str結束
if (typeof String.prototype.endsWith != 'function') {
	String.prototype.endsWith = function (str){
		return this.slice(-str.length) == str;
	};
}

/* 上傳 */
function multipartUpload (src,_dist) {
	client.putObject({
			Bucket: bucket,
			Region: Region,
			Key: _dist,
			StorageClass: 'STANDARD',
			Body: fs.createReadStream(src), // 上傳文件對象
			onProgress: function(progressData) {
				console.log(JSON.stringify(progressData));
			}
		}, function(err, data) {
		  console.log('上傳完成')
			console.log(err || data);
		});

}

/* 批量刪除 */
async function deleteMulti (dist, src, objList) {
	console.log('刪除數量：', objList.length)
	if (objList.length === 0) {
		addFiles(src, dist)
		return
	}
	// 刪除
	client.deleteMultipleObject({
		Bucket: bucket,
		Region: Region,
		Objects: delList
	}, function(err, data) {
		console.log(err || data);
		addFiles(src, dist)
		objList = []
	});


}

/* 獲取要添加的文件 */
async function addFiles(src, dist){
	var docs = fs.readdirSync(src);
	docs.forEach(function(doc){
		var _src = src + '/' + doc,
			_dist = dist + '/' + doc;
		var st = fs.statSync( _src);
		// 判斷是否爲文件
		if( st.isFile()&&doc!=='.DS_Store' ){
			if (_src.endsWith('.js')
				||_src.endsWith('.css')
				||_src.endsWith('.ttf')
				||_src.endsWith('.wof')
				||_src.endsWith('.png')
				||_src.endsWith('.ico')){
				multipartUpload(_src, _dist)
			}
			console.log(_src+'是文件',_dist)
		}
		// 如果是目錄則遞歸調用自身
		else if( st.isDirectory() ){
			// console.log(_src+'是文件夾')
			addFiles( _src, _dist);
		}
	})
}



/* 查詢所有的資源 */
function listDir(dist, src, nextMarker){
	client.getBucket({
		Bucket: bucket,
		Region: Region,
		Prefix: dist,
		Marker: nextMarker //起始對象鍵標記
	}, function (err, data) {
		console.log(err || data);
		if (data && data.Contents.length >0) {
			data.Contents.forEach(function (obj) {
				console.log('Object: %s', obj.Key);
				delList.push({
					Key: obj.Key
				})
			});

			if (data.IsTruncated === 'true') { // 是否有更多
				console.log('-------更多數據-------', data.NextMarker)
				listDir(dist, src, data.NextMarker)
			} else {
				deleteMulti(dist,src, delList)
			}
		} else {
			addFiles(src, dist)
		}
	});

}

function uploadOSS(src,dist){
	// 所有的
	listDir(dist, src)
}

module.exports = uploadOSS

3，在build.js中引入uploadOSS

const path = require('path')
const uploadOSS = require('./uploadOSS')
const local = path.join(__dirname, "../dist");

   在打包結束處添加上傳代碼

// 上傳到oss
new uploadOSS(local, process.env.env_config + '項目名')

4，在webpack.prod.conf.js 修改 output

publicPath: 'https://myBucket.cos.ap-shenzhen-fsi.myqcloud.com/'+ process.env.env_config + '項目名/',   // 可用於配置oss cdn 等資源路徑