vue项目打包部署到服务器并使用cdn加速

news2024/11/17 0:00:53
  • 配置 vue.config.js文件
const isProd = process.env.NODE_ENV === 'production'
module.exports = {
  // 其他配置
  chainWebpack: config => {
    // 生产环境下使用CDN
    if (isProd) {
      config.plugin('html')
        .tap(args => {
          args[0].cdn = assetsCDN
          return args
        })
    }
  },
  // 生产环境下替换路径为cdn路径
  publicPath: isProd ? process.env.VUE_APP_PUBLIC_PATH_PROD : process.env.VUE_APP_PUBLIC_PATH,
}
// .env 文件变量
VUE_APP_PUBLIC_PATH=/
// cdn存储路径
VUE_APP_PUBLIC_PATH_PROD=https://jz-pro-server.oss-cn-hangzhou.aliyuncs.com/cdn/a_项目名称

在这里插入图片描述
在这里插入图片描述

  • a_项目名称存储的内容为打包的dist文件内容
  • 将打包好的dist文件上传到服务器对应目录,
  • 后续只需要将打包好的本地dist文件中的index.html文件更新至服务器中的index.html文件

并且全量替换cdn中的dist文件内容
在这里插入图片描述

  • 打包的dist文件里 index.html文件内容
    在这里插入图片描述

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

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

相关文章

第十二回 急先锋东郭争功 青面兽北京斗武-FreeBSD/Linux SSH配置和常用软件

周谨和杨志第一轮比枪,为了安全,将枪尖去掉,包上柔软的毡片,再蘸满石灰。两人打了四五十个回合,只见周谨身上斑斑点点,约有三五十处,而杨志身上只有左肩牌下一点白。 周谨不服又来比射箭&#x…

如何在云服务上通过docker部署服务?

如何在云服务上通过docker部署服务? 一、在云服务器上安装Docker1、查看云服务器的OS信息2、[安装Docker并使用(Linux)](https://help.aliyun.com/zh/ecs/use-cases/deploy-and-use-docker-on-alibaba-cloud-linux-2-instances) 二、通过dock…

互斥锁/读写锁(Linux)

一、互斥锁 临界资源概念: 不能同时访问的资源,比如写文件,只能由一个线程写,同时写会写乱。 比如外设打印机,打印的时候只能由一个程序使用。 外设基本上都是不能共享的资源。 生活中比如卫生间,同一…

视频尺寸魔方:分层遮掩3D扩散模型在视频尺寸延展的应用

▐ 摘要 视频延展(Video Outpainting)是对视频的边界进行扩展的任务。与图像延展不同,视频延展需要考虑到填充区域的时序一致性,这使得问题更具挑战性。在本文中,我们介绍了一个新颖的基于扩散模型的视频尺寸延展方法——分层遮掩3D扩散模型(…

Apollo Cyber RT:引领实时操作系统在自动驾驶领域的创新

🎬 鸽芷咕:个人主页 🔥 个人专栏:《linux深造日志》《粉丝福利》 ⛺️生活的理想,就是为了理想的生活! ⛳️ 推荐 前些天发现了一个巨牛的人工智能学习网站,通俗易懂,风趣幽默,忍不住分享一下…

Linux的常见指令和基本操作演绎【复习篇章一】

文章目录 前言下载安装 XShellXShell 下的复制粘贴热键操作01.ls指令tree 02.cd指令03.touch指令04.mkdir指令(重要):05.rmdir指令 && rm 指令(重要)06.组合07.man指令(重要)&#xff1…

【lodash.js】非常好用高性能的 JavaScript 实用工具库,防抖,深克隆,排序等

前言:lodash是一款前端必须要知道的js库,它里面提供了许多常用的功能和实用的工具函数 基本上我参与的项目中都有lodash,只能说lodash太强大了,lodash.js 提供了超过 300 个实用的工具函数,涵盖了很多常见的编程任务 l…

群辉NAS的远程访问

群辉NAS是私有云存储,局域网访问很容易【详见:网上邻居访问设置、其它设备的访问设置】,远程访问相对复杂,涉及很多关键因素,现将过程记录如下: 目录 1、互联网接入 2、绑定MAC与IP地址 3、路由器开启5…

HTML5与App封装技术将网站一键打包成App

HTML5:跨平台的利器HTML5作为一种先进的网页标记语言,其最大的优势在于跨平台性。开发者仅需编写一次代码,即可在各种操作系统和设备上运行,无需为每个平台单独开发App。这种“编写一次,运行处处”的模式,大…

选择海外云手机需要考虑什么?

随着跨境电商行业的蓬勃发展,企业们纷纷寻找提升平台流量和广告投放效果的方法,这已成为业界的当务之急。传统的宣传模式在国内受到直播和链接带货等新兴方式的冲击,而在国外,类似的趋势也在悄然兴起,呈现出广阔的发展…

OOM 内存溢出与线上内存实时监控

单应用可用的最大内存 dalvik.vm.heapstartsize,它表示堆分配的初始大小。 APP启动的初始分配内存 dalvik.vm.heapgrowthlimit,它表示单个进程内存限定值。App最大内存限制 dalvik.vm.heapsize,单个进程可用的最大内存。开启largeHeap"t…

力扣646. 最长数对链

动态规划 思路: 思路与 力扣354. 俄罗斯套娃信封问题 类似将序列进行排序,然后假设 dp[i] 为第 i 个元素的最长数对链个数;则其状态转移方程: 第 i 个元素之前的某一个元素(假设是下标是 j),如…

VS2022联合Qt5开发学习11(QT5.12.3联合VTK在VS2022上开发医学图像项目5——qvtkWidget上显示STL三维图像并取点)

这篇博文是接着这个系列前面的博文,来讲如何实现医学图像三视图同步视图。我想到的一个思路是用Scrollbar来控制切面的改变,还有一个想法是在三维图像上取点,然后以这个点为切面中心更新三维视图。这篇博文主要介绍的就是第二个想法的三维图像…

软件功能测试如何确定测试需求?CMA、CNAS软件测试报告获取

软件功能测试是为了验证软件的功能是否按照设计要求正常工作的过程,可以确保软件的质量,提高用户体验,也是保证软件安全和可靠性的重要一环。我们需要从多个角度对软件的各个功能模块进行测试,确保每个功能都能正常运行&#xff0…

蓝桥杯备战——5.动态数码管扫描

1.分析原理图 经查阅说明书得知数码管为共阳极,共阳端口接到了U8,而段码接到了U7。 如果需要选中U8,我们只需要将P250;P261;P271; 如果需要选中U7,我们只需要将P251;P261;P271; 2.代码示例 void Delay1ms() //12.000MHz {unsigned char data i, j;i 12;j 169;…

Elasticsearch内核解析 - 数据模型篇

Elasticsearch内核解析 - 数据模型篇 - 知乎 Elasticsearch是一个实时的分布式搜索和分析引擎,它可以帮助我们用很快的速度去处理大规模数据,可以用于全文检索、结构化检索、推荐、分析以及统计聚合等多种场景。 Elasticsearch是一个建立在全文搜索引擎…

【运维】Ubuntu18.04系统docker方式安装ElasticSearch和kibana

前言 最近需要搭建一套测试环境,用到了ElasticSearch( 简称es)搜索引擎,安装过程有些曲折,记录下来作为经验。 正文 环境 Ubuntu18.04 操作系统Docker Server Version: 20.10.7ElasticSearch Version: 8.5.3Kibana Version: 8.5.3 说明 E…

【C++】STL和vector容器

STL和vector容器 基本概念六大组件容器算法迭代器容器算法迭代器 vector容器基本概念vector构造函数赋值vector的容量和大小vector插入与删除vector存取数据函数原型 vector互换容器vector预留空间vector容器嵌套容器 基本概念 长久以来,软件届一直希望建立一种可重…

腾讯云轻量应用Windows服务器如何搭建幻兽帕鲁Palworld私服?

幻兽帕鲁/Palworld是一款2024年Pocketpair开发的开放世界生存制作游戏,在帕鲁的世界,玩家可以选择与神奇的生物“帕鲁”一同享受悠闲的生活,也可以投身于与偷猎者进行生死搏斗的冒险。而帕鲁可以进行战斗、繁殖、协助玩家做农活,也…

跨平台同步 Shell 历史记录,无缝切换会话 | 开源日报 No.154

atuinsh/atuin Stars: 14.3k License: MIT Atuin 是一个用 SQLite 数据库替换现有 shell 历史记录的工具,可以记录命令的额外上下文,并提供可选且完全加密的历史同步功能。其主要功能和核心优势包括: 重新绑定 ctrl-r 和 up (可配置) 到全屏…