时间:2021-07-01 10:21:17 帮助过:57人阅读
一般 vue 的项目,大家都是直接把最后生成的 css js 等文件直接上传到服务器,并没有才有 cdn 的业务
这样做一般有2个弊端,
不过虽然知道归知道,但是每次都手动把 js css 文件传到七牛上很累的。
尤其是在改动频繁的情况下,上传七牛每次上传七牛 cdn 很浪费时间。
于是就去找七牛的文档,决定用脚本来解决这个问题,我是用的 python
sdk 实现得。
python
环境请自行安装
首先下载七牛的包
pip install qiniu
然后安装第三方的依赖包 glob2
pip install glob2
upqiniu.py
# -*- coding: utf-8 -*- from qiniu import Auth, put_file, import qiniu.config import glob2 import os #需要填写你的 Access Key 和 Secret Key access_key = '*********************' secret_key = '**********************' #构建鉴权对象 q = Auth(access_key, secret_key) #要上传的空间 bucket_name = '****' resources = glob2.glob('dist/static/**') def upload(path): file_name = path.replace('dist/', '') key = file_name token = q.upload_token(bucket_name, key, 3600) localfile = './' + path put_file(token, key, localfile) for r in resources: if os.path.isfile(r): upload(r)
需要将本脚本(upqiniu.py)放到 dist 同级目录下,如下图:
image.png
脚本中的 access_key secret_key 你登录七牛后在个人资料中即可找到:
还需要将 webpack 的 publicPath 改成七牛的地址即改成下面这个
在 vue 的项目中,只需要改动 config 目录下面的 index.js 即可
虽然改动起来有一点小麻烦,但是一劳永逸,
首先 npm run build
然后 python upqiniu.py
最后将你的 index.html
拉到线上服务器就可以了。
ps: 这个脚本会将 dist/static/
的所有文件上传到七牛,包括 字体文件 , 图片等。
以上就是本文的全部内容,希望对大家的学习有所帮助,也希望大家多多支持脚本之家。