vue-打包

打包的作用

说明:vue脚手架只是开发过程中,协助开发的工具,当真正开发完了=>脚手架不参与上线

打包的作用:

1)将多个文件压缩合并成一个文件

2)语法降级

3)less sass ts语法解析

打包后,可以生成,浏览器能够直接运行的网页=>就是需要上线的源码

打包的命令和配置

说明:vue脚手架工具已经提供了打包命令,直接使用即可

命令:yarn build

结果:在项目的根目录会自动创建一个文件夹'dist',dist中的文件就是打包后的文件,放到服务器中即可

配置:默认情况下,需要放到服务器根目录打开,如果希望双击运行,需要配置publicPath配成相对路径

publicPath: './'

配置好后再使用命令打包,就可以本地双击打开或者不用放到根目录也能正常打开

路由懒加载

说明:当打包构建应用时,Javascript包会变得非常大,影响页面加载。如果我们能把不同路由对应的组件分割成不同的代码块,然后当路由被访问的时候才加载对应组件,这样就更加高效了。

异步组件改造

判断:与首页相关的页面默认加载,无需更改;不与首页相关的页面进行改造

改造完后,懒加载的页面需要往下放

完成后,再重新使用打包命令,懒加载实现

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

如若内容造成侵权/违法违规/事实不符,请联系我们进行投诉反馈qq邮箱809451989@qq.com,一经查实,立即删除!

相关文章

羊大师解读,羊奶的口味更适合哪些人群?

羊大师解读,羊奶的口味更适合哪些人群? 羊奶作为一种营养丰富的乳制品,拥有许多独特的品质和口味,备受消费者的青睐。它不仅含有丰富的蛋白质、维生素和矿物质,还具有更易消化的特点,适合许多人群的饮用。…

CSS新增文本描边-text-stroke属性

-webkit-text-stroke属性 概念:-webkit-text-stroke属性为文本添加描边效果。所谓的描边效果,指的是给文字添加边框 语法: -webkit-text-stroke:width color;Chrome和Firefox这两个浏览器都只能识别带有-webkit前缀的text-stroke属性 -web…

【HarmonyOS开发】ArkUI-X 跨平台框架(使用ArkTs开发AndroidIOS)

ArkUI-X 跨平台框架进一步将 ArkUI 开发框架扩展到了多个OS平台,目前支持OpenHarmony、HarmonyOS、Android、 iOS,后续会逐步增加更多平台支持。开发者基于一套主代码,就可以构建支持多平台的精美、高性能应用。 一、跨平台框架有哪些? 1、…

CyberLink的视频编辑软件PowerDirector Ultimate 2024 22.0版本在win系统下载与安装配置

目录 前言一、PowerDirector Ultimate安装二、使用配置总结 前言 PowerDirector Ultimate是由CyberLink公司开发的一款视频编辑软件,其为高级版本,拥有多种强大的视频编辑和效果功能。该软件具有许多强大的功能和工具,包括多轨时间线编辑、视…

DevEco Studio集成ArkUI-X

DevEco StudioHarmonyOs教程 (免费学): 最新HarmonyOS系列教程下载地址-IT营大地老师--更新中 ArkUI-X进一步将ArkUI扩展到了多个OS平台:目前支持OpenHarmony、HarmonyOS、Android、 iOS,后续会逐步增加更多平台支持。…

手写一个加盐加密算法(java实现)

目录 前言 什么是MD5?? 加盐算法 那别的人会不会跟你得到相同的UUID? 如何使用盐加密? 代码实现 前言 对于我们常见的登录的时候需要用到的组件,加密是一个必不可少的东西,如果我们往数据库存放用户…

怎么查询网络出口IP

怎么查询自己的网络的出口IP 背景 一般跟第三方服务进行接口数据交互的时候,对方都会让我们提供调用接口的网络的出口IP,对方会把该IP地址加到对方的白名单中。这样我们才能有权限进行接口的访问。 解决办法 下面介绍三种常用的查询网络出口IP的办法…

弧垂观测手段再升级!输电线路导线弧垂检测装置的应用_深圳鼎信

输电线路导线弧垂是指在输电线路中导线的水平位置与塔杆之间的垂直距离。导线的弧垂是确定导线张力、塔杆高度等参数的重要依据。通过测量弧垂及时调整弧垂大小对保证输电线路的安全运行具有重要作用。鼎信将介绍两种测量弧垂的方法,一起来学习一下吧! …

设计模式篇章(2)——五种创建者模式

创建者模式主要思考如何创建一个对象,如何将对象的创建与使用分离。一般初级程序员都是new一个对象,然后紧接着使用这个对象,在某些场景中这样子是有问题的,需要使用创建者模式替代的(例如使用单例模式)。设…

第G2周:人脸图像生成(DCGAN)

🍨 本文为[🔗365天深度学习训练营学习记录博客\n🍦 参考文章:365天深度学习训练营\n🍖 原作者:[K同学啊 | 接辅导、项目定制]\n🚀 文章来源:[K同学的学习圈子](https://www.yuque.co…

Linux第1步_VMware软件安装

1、双击“VMware-workstation-full-15.5.0-14665864”,得到下面的界面: 2、等待几分钟,得到下面的界面: 3、点击“下一步” 4、勾选“我接受许可协议中的条款(A)”,见下图: 5、点击“下一步”,得…

爬取猫咪交易网

爬取猫咪品种,价格等在售数据 代码展现: 具体代码: import requests import re import os filename 声音// if not os.path.exists(filename): os.mkdir(filename) def down_load(page): for page in range(page): page …

Python3 元组----20240105

Python 的元组与列表类似,不同之处在于元组的元素不能修改。 元组使用小括号 ( ),列表使用方括号 [ ]。 元组创建很简单,只需要在括号中添加元素,并使用逗号隔开即可。 >>> tup1 = (Google, Runoob, 1997, 2000) >>> tup2 = (1<

如何选择最适合的采购付款 (P2P) 解决方案?

无论企业的业务流程执行得如何&#xff0c;流程中始终存在改进空间。更好的管理系统是获得更好结果的关键&#xff0c;尤其是当企业处于增长阶段时。强大的采购到付款&#xff08;P2P&#xff09;系统是加快采购流程&#xff0c;同时保持采购支出可见性的最有效方法之一。 什么…

Mysql 分割字符串,一行变多行,@rownum,mysql.help_topic

1 前言 朋友最近遇到一个比较棘手的 sql 问题&#xff0c;让我帮忙看看&#xff1a; 他有两张表 testa 和 testb &#xff0c;一个表存的日期&#xff0c;另一个表存字符串例如 2023-11-01,2023-11-02&#xff0c;如何将这两张表关联起来&#xff0c;只查 testa 表的数据&#…

什么是负载均衡?什么情况下又会用到负载均衡

什么是负载均衡 在大型的网络应用中&#xff0c;使用多台服务器提供同一个服务是常有的事。平均分配每台服务器上的压力、将压力分散的方法就叫做负载均衡。 [利用 DNS来实现服务器流量的负载均衡&#xff0c;原理是“给网站访问者随机分配不同ip”] 什么情况下会用到负载均…

WAF的概念、分类和应用

WAF&#xff08;Web Application Firewall&#xff0c;Web应用防火墙&#xff09;是一种保护Web应用程序的安全工具&#xff0c;它可以监控、过滤和阻止Web应用程序和互联网之间的HTTP流量。WAF通常可以防御一些常见的Web攻击&#xff0c;如跨站请求伪造&#xff08;CSRF&#…

救命,现在当行政真的可以不用太老实

行政的姐妹在哪里啊&#xff1f;这个打工工具真的要知道哦&#xff01; 信我&#xff0c;真的好用啊&#xff01;终于不用自己写总结写材料的啊&#xff01; 这东西写啥都可以&#xff0c;只要输入需求马上就写好了啊&#xff0c;什么工作总结&#xff0c;活动策划方案&#…

Security的入门和流程分析

Security的入门和流程分析 问题&#xff1a;访问一个controller方法之前进行一个权限验证&#xff1f; 在controller里面的每一个handler无论什么访问都要进行一个校验&#xff0c;但是对于login logout 验证码这种Handler处理器是放行的 1.使用过滤器拦截器 注意两者区别 过滤…

2023中国PostgreSQL数据库生态大会-核心PPT资料下载

一、峰会简介 大会以“极速进化融合新生”为主题&#xff0c;探讨了PostgreSQL数据库生态的发展趋势和未来方向。 在大会主论坛上&#xff0c;专家们就PostgreSQL数据库的技术创新、应用实践和生态发展进行了深入交流。同时&#xff0c;大会还设置了技术创新&云原生论坛、…