前端部署自动上传资源文件到cdn/oss 解决路由和访问慢的问题

参考文档:webpack-aliyun-oss-plugin - npm

安装依赖,这是一个预编译环境下的包

npm install webpack-aliyun-oss-plugin --save-dev

以下代码的意思是:

webpack中引入一个oss上传插件,并且给予其初始参数,插件根据publicPath提供的域名后的path,将打包的文件一个个按照上传到path对应的目录中,并且根据from的路径指示,将./dist/static下的所有文件都按路径上传

1,关键点一:/scrm/xxa/xxb 无论建立多少级,oss桶都是自动建立的,无需人手动先把这些目录建立了,例如上面的path对应oss的目录/scrm/xxa/xxb下面,./dist/static下的文件也会被上传到这个目录下,这个目录却不需要先行建立

publicPath: process.env.NODE_ENV === 'production' ? `https://static-global.uncledesk.com/${version_path}/` : '/',chainWebpack: config => {config.resolve.symlinks(true); // 修复热更新失效// 如果使用多页面打包,使用vue inspect --plugins查看html是否在结果数组中config.plugin("html").tap(args => {// 修复 Lazy loading routes Errorargs[0].chunksSortMode = "none";return args;});if (IS_PROD) {config.plugin('webpack-aliyun-oss-plugin')// 原案例中这里用了require, 我通过vue.config.js官方文档了解到,不加// 也可以,事实上不加也可以.use('webpack-aliyun-oss-plugin', [{from: ['./dist'],region: 'oss-us-west-1',ak: 'xxxx',sk: 'xxxxxxxx',bucket: 'static-oss-cdn',filter: function (asset) {return !/\.html$/.test(asset); // 不上传index.html}}]);}
}

version_path: "1_3_25" 可以通过 package.json 中的version参数,然后根据点转下划线,为何强调这一点,因为如果一开始不做好版本隔离,那么以后你想从cdn删除,就够麻烦了,所以这里特别提醒记得做版本文件夹隔离,不用的版本到时直接删掉就OK了

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处:http://www.mzph.cn/news/871576.shtml

如若内容造成侵权/违法违规/事实不符,请联系多彩编程网进行投诉反馈email:809451989@qq.com,一经查实,立即删除!

相关文章

NAT地址转换+多出口智能选路,附加实验内容

本章主要讲:基于目标IP、双向地址的转换 注意:基于目标NAT进行转换 ---基于目标IP进行地址转换一般是应用在服务器端口映射; NAT的基础知识 1、服务器映射 服务器映射是基于目标端口进行转换,同时端口号也可以进行修改&…

方波的傅里叶变换及方波的MATLAB实现

一、傅里叶变换简介 傅里叶变换,表示能将满足一定条件的某个函数表示成三角函数(正弦和/或余弦函数)或者它们的积分的线性组合。傅里叶变换是一种线性的积分变换。它的理论依据是:任何连续周期信号都可以由一组适当的正弦曲线组合…

stm32h743 NetXduo 实现http server CubeIDE+CubeMX

在这边要设置mpu的大小,要用到http server,mpu得设置的大一些 我是这么设置的,做一个参考 同样,在FLASH.ld里面也要对应修改,SECTIONS里增加.tcp_sec和 .nx_data两个区,我们用ram_d2区域去做网络,这个就是对应每个数据在d2区域的起点。 在CubeMX里,需要用到filex、dhc…

无损音乐播放器推荐:Audirvana for Mac 中文激活版

udirvana 是一款高品质的音乐播放软件,专为Mac操作系统设计。它被设计来提供音频播放的最高标准,支持多种音频格式,包括高达32位/192kHz的高分辨率音频。Audirvana Plus 是其高级版本,提供了更多的功能和优化,例如音频…

Qt Mqtt客户端 + Emqx

环境 Qt 5.14.2 qtmqtt mqttx 功能 QT Mqtt客户端 qtmqtt 下载 qtmqtt (注意下载与QT版本相符的库)并使用QT 编译 编译完成后需要的文件: emqx 1.虚拟机中安装emqx,并启动 curl -s https://assets.emqx.com/scripts/install-emqx-deb.sh | sudo bash sudo apt-get inst…

前端Vue组件化实践:打造仿京东天猫商品属性选择器组件

在前端开发领域,随着业务需求的日益复杂和技术的不断进步,传统的整体式应用开发模式已逐渐显得捉襟见肘。面对日益庞大的系统,每次微小的功能修改或增加都可能导致整个逻辑结构的重构,形成牵一发而动全身的困境。为了解决这一问题…

树莓派PICO使用INA226测量电流和总线电压(3)

上一篇文章我们讲了如何测试电流,但是INA226有一个非常典型的问题,那就是误差比较大,因为采样电阻非常小,我的开发板用的是100mΩ的采样电阻,在设定中我也用的是这个采样电阻值,但事实上,测试得…

免费开源工具—— Clarity Al:一键图像放大/增强,Magnific平替!

今天给大家推荐一款图像增强工具——Clarity AI ,免费且开源,快来看看吧! 1、效果展示 MagnificAl是一款基于人工智能技术的图像处理工具,主要功能包括图像放大、像素级AI重绘、灵活的设置调整以及多种优化场景。它能够支持最高放大至16倍,甚…

算法力扣刷题记录 四十五【110.平衡二叉树】

前言 二叉树篇继续 记录 四十五【110.平衡二叉树】 一、题目阅读 给定一个二叉树,判断它是否是 平衡二叉树。 示例 1: 输入:root [3,9,20,null,null,15,7] 输出:true示例 2: 输入:root [1,2,2,3,3…

电容充放电时间计算

电容充电时间的结论:t充电 R * C 时,Ut2*VCC/3,这是一个不能让我释怀的结论。 1、电池充电 U0表示电容C在充电0时刻的电压值; Ut表示电容C在充电t时刻的电压值; U1表示电容C在充电∝时刻的电压值,就是电源电压; Q C * U ---…

【C/C++积累技巧】实现 连续播放文件图片+逐帧文本显示, 同时 可以按任意键退出(基于easyx小游戏编程)

技巧一、使用 IMAGE数组循环&#xff1a;实现【连续播放图片】 &#xff08;1&#xff09;一张图片如何放映在 图形化窗口上&#xff1a;借用两个函数 #include<graphics.h> // 函数的头文件IMAGE imgMy; // 图形变量 loadimage(&imgMy, "写入你想显示的图片路…

Java高频面试基础知识点整理27

干货分享&#xff0c;感谢您的阅读&#xff01;背景​​​​​​高频面试题基本总结回顾&#xff08;含笔试高频算法整理&#xff09; 最全文章见&#xff1a;Java高频面试基础知识点整理 &#xff08;一&#xff09;Java基础高频知识考点 针对人员&#xff1a; 1.全部人员都…

vs2019 QT无法打开源文件QModbusTcpClient

vs2019无法打开源文件QModbusTcpClient 如果配置的msvc2019,则查找到Include目录 然后包含&#xff1a; #include <QtSerialBus/qmodbustcpclient.h>

STL 提供的容器可以有多快?(下)「榨干最后一滴」

以下内容为本人的烂笔头&#xff0c;如需要转载&#xff0c;请声明原文链接 微信公众号「ENG八戒」https://mp.weixin.qq.com/s/QWgA97TDMGBnwR4hKA7BwA 查表的消耗 某些场景下需要用到大量的 (string, X) 键值对来存储数据&#xff0c;标准库提供了关联容器 std::map 来解决键…

Python酷库之旅-第三方库Pandas(021)

目录 一、用法精讲 52、pandas.from_dummies函数 52-1、语法 52-2、参数 52-3、功能 52-4、返回值 52-5、说明 52-6、用法 52-6-1、数据准备 52-6-2、代码示例 52-6-3、结果输出 53、pandas.factorize函数 53-1、语法 53-2、参数 53-3、功能 53-4、返回值 53-…

经典卷积网络

放假回家了&#xff0c;感觉快坚持不下去了&#xff0c;目前还没有找到关于无监督学习实现分类的课程&#xff0c;普通数据当然肯定不会给你实现分类的啊 给些建议吧。 LeNet 通过共享卷积核&#xff0c;减少网络参数。 一般只统计卷积计算层和全连接计算层&#xff0c;其余操…

【redis操作语句】

1.数据库操作 redis默认有16个数据库&#xff0c;编号为0~15&#xff0c;且默认访问0号数据库 获取当前键值对数量:先set创建一个键值对,再用dbsize获取&#xff0c;flushdb清空再获取。 127.0.0.1:6379> set k1 v1 OK 127.0.0.1:6379> dbsize (integer) 1 127.0.0.1:…

安卓onNewIntent 什么时候执行

一.详细介绍 onNewIntent 方法 onNewIntent 是 Android 中 Activity 生命周期的一部分。它在特定情况下被调用&#xff0c;主要用于处理新的 Intent&#xff0c;而不是创建新的 Activity 实例。详细介绍如下&#xff1a; 使用场景 singleTop 启动模式&#xff1a; 如果一个 Ac…

UML建模案例分析-需求对类图的影响很大

概要 类图描述系统中类的静态结构。 概念是概念&#xff0c;但类图受需求的影响是非常大的&#xff0c;可以说类图是建模的源头。尽管用例图是源头&#xff0c;但对类图的作用有限。 例子 进销存系统里&#xff0c;产品类中&#xff0c;至少要包括如下属性&#xff1a;名称…

现代动力系统理论导论 第一卷+第二卷 Anatole Katok 金成桴

第0章 引言 0&#xff0e;1&#xff0e; 动力学主要分支 0&#xff0e;2&#xff0e; 流&#xff0c;向量场&#xff0c;微分方程 0&#xff0e;3&#xff0e; 时间1映射&#xff0c;截面&#xff0c;扭扩 0&#xff0e;4&#xff0e; 线性化与局部化 第1部分 例子与基本概念 …