vue3 vite title 页面标题设置
效果图:

1. 安装 vite-plugin-html 插件
npm install vite-plugin-html -D
2. 修改 vite.config.js
import {defineConfig, loadEnv} from 'vite'
import { createHtmlPlugin } from "vite-plugin-html"
import {resolve} from 'path'
import vue from '@vitejs/plugin-vue'// https://vitejs.dev/config/
export default defineConfig(({mode, command, ssrBuild}) => {const root = process.cwd();const env = loadEnv(mode, root);return {plugins: [vue(),//修改index.html标题createHtmlPlugin({inject: {data: {title: env.VITE_APP_API_TITLE,},},}),],resolve: {//路径别名alias: {'@': resolve(__dirname, './src')}},server: {proxy: {[env.VITE_APP_BASE_API]: {// target: 'http://localhost:3001',changeOrigin: true,rewrite: path => path.replace(env.VITE_APP_BASE_API, '')}},hmr: {overlay: false, // 禁用开发服务器错误的屏蔽},},build: {minify: "terser", // 混淆器,terser 构建后文件体积更小,'terser' | 'esbuild'rollupOptions: {output: {// 最小化拆分包manualChunks(id) {if (id.includes("node_modules")) {return id.toString().split("node_modules/")[1].split("/")[0].toString();}},chunkFileNames: "js/[name].[hash].js", // 用于命名代码拆分时创建的共享块的输出命名,[name]表示文件名,[hash]表示该文件内容hash值},},terserOptions: {// 生产环境移除console打印compress: {drop_console: true,drop_debugger: true,},// 去掉注释内容output: {comments: true,},}}}}
)
index.html 的内容
<title><%= title %></title>
上述语法使用 vite.config.js中的变量

相关文章:
vue3 vite title 页面标题设置
效果图: 1. 安装 vite-plugin-html 插件 npm install vite-plugin-html -D2. 修改 vite.config.js import {defineConfig, loadEnv} from vite import { createHtmlPlugin } from "vite-plugin-html" import {resolve} from path import vue from vitej…...
spring boot添加License(软件许可)
文章目录 前言1. 生成钥匙库2. 生成证书3. 生成公匙库4.业务代码1. 引入依赖2. 关键代码3. 配置文件 5、改成线上地址,这样不用每次打包,发送license.lic文件给客户,重启项目就行5.1、工具类5.2 修改部分: 总结 前言 工作需要给软…...
LangChain打造一个AI客服
最近在学习LangChain,langchain的第一个入门应用就是和ChatGPT结合形成的一个AI客服,本期文章就带大家一起认识下 LangChain LangChain是现在用得最多的AI框架,langchain在帮助如基于文档数据的回答、聊天机器人和代理这类的应用程序 langch…...
【前端三剑客之JS】详解JS
1. JS的引入方式 (1). 内部脚本方式引入 在页面上,通过一对script标签引入js代码.script代码放置位置有一定随意性,一般放在head标签中. (2).外部脚本方式引入. 内部脚本只能在当前页面中使用,代码复用度不高.可以将脚本放在单独的js文件…...
重庆耶非凡科技有限公司有选品师项目培训吗?
在当今科技飞速发展的时代,各种科技公司如雨后春笋般涌现,它们在不同领域发挥着重要作用。其中,重庆耶非凡科技有限公司以其独特的业务模式和专业服务,在业界赢得了良好的口碑。那么,重庆耶非凡科技有限公司究竟是做什…...
格式转化——Labelme标注好的json文件批量转为png(标签)文件(物体为红色,背景为黑色)和jpg原图
作用如题目,批量将标注好的json文件转成png标签,jpg原图,其中标签时红黑图。 代码如下: import argparse import base64 import json import os import os.path as osp import imgviz import PIL.Image import yaml from labelm…...
力扣刷题--2535. 数组元素和与数字和的绝对差【简单】
题目描述 给你一个正整数数组 nums 。 元素和 是 nums 中的所有元素相加求和。 数字和 是 nums 中每一个元素的每一数位(重复数位需多次求和)相加求和。 返回 元素和 与 数字和 的绝对差。 注意:两个整数 x 和 y 的绝对差定义为 |x - y| 。…...
2024年【危险化学品经营单位安全管理人员】考试报名及危险化学品经营单位安全管理人员找解析
题库来源:安全生产模拟考试一点通公众号小程序 危险化学品经营单位安全管理人员考试报名考前必练!安全生产模拟考试一点通每个月更新危险化学品经营单位安全管理人员找解析题目及答案!多做几遍,其实通过危险化学品经营单位安全管…...
IntelliJ IDEA集成Baidu Comate,商城系统支付交易功能开发实战
文章目录 Baidu Comate介绍安装配置体验安装插件配置体验注释生成代码技术问答 实战设计表生成代码导入数据 总结 Baidu Comate介绍 在科技互联网飞速发展的今天,百度凭借其深厚的技术积累和创新能力,推出了一款名为Baidu Comate智能代码助手的产品。该…...
20212313 2023-2024-2 《移动平台开发与实践》第5次作业
20212313 2023-2024-2 《移动平台开发与实践》第5次作业 1.实验内容 设计并开发一个地图应用系统。 该实验需提前申请百度API Key,调用接口实现百度地图的定位功能、地图添加覆盖物和显示文本信息。 2.实验过程 2.1 获取SHA1 (1)打开控制台…...
Python图形界面(GUI)Tkinter笔记(十二):用【Entry()】实现单行文本输入(3)
Tkinter库中的单行文本输入框(Entry)除了与get()方法组合产生多姿多彩的反应,还可以与insert()方法组合而产生新的功能。例如用于用户不作任何输入就用默认值当作用户的输入这种场境,或在输入文本中加入指定的字符等。 其余笔记:【Python图形界面(GUI)Tkinter笔记(总目录…...
前端渲染页面的原理
之前一直不愿意写一篇关于原理的,因为说起来实在是太繁杂,要写得细,码字梳理,计算下来起码都要差不多三周。以前一直躲避这个事情,现在反正有时间,为了不荒废自己,那就从头捋一遍。也方便自己后…...
【一竞技DOTA2】RAMZES666替补参加裂变联赛
1、根据主办方文件,RAMZES666将继续作为Tundra战队替补参加裂变联赛。该比赛为欧洲线上赛,于5月27日-30日举行,总奖金8万美元。 除此之外,Nigma战队在上个月宣布四号位Matthew离队后,也选择启用老队员GH参赛。而在本月初让ah fu转回教练、携替补Thiolicor出战PGL瓦拉几亚的Secr…...
1109 擅长C(测试点0,1,2,3)
当你被面试官要求用 C 写一个“Hello World”时,有本事像下图显示的那样写一个出来吗? ..C.. .C.C. C...C CCCCC C...C C...C C...C CCCC. C...C C...C CCCC. C...C C...C CCCC. .CCC. C...C C.... C.... C.... C...C .CCC. CCCC. C...C C...C C...C C…...
北京新高度画室:端午假期免费吃,住,学!
经历了联考校考的过关斩将 2024届追梦人终于要迎来最后一战高考 承载着梦想的日子在一天天靠近 千里遥程将要看到希望的曙光 新高度祝所有高三学子高考顺利金榜题名 梦想是一场接力赛 新高度画室2025届集训已经开始 如果你错过了清明、错过了五一 那么高考&端午试学…...
电脑重要文件如何加密保护?教你两种方法
加密是保护电脑重要文件的常见方法,可以有效避免文件数据泄露。那么,电脑重要文件该如何加密保护呢?下面小编就来教你两种方法,帮助你解决文件安全问题。 超级加密3000 超级加密3000是一款专业的电脑数据加密软件,可以…...
新零售收银解决方案:传统门店超市的数字化-亿发
在数字化浪潮的推动下,零售行业正经历着前所未有的变革。阿里巴巴提出的“新零售”概念,不仅仅是一个商业口号,它代表了一种全新的商业模式和运营理念。随着时代的进步和消费需求的不断升级,新零售的兴起已成为行业发展的必然趋势…...
独家揭秘!Amazon、lazada、Shopee测评自养号,新手也能秒变高手!
近年来,随着国内卖家涌入跨境电商平台,市场竞争愈加激烈。为了迅速占领市场,测评变得至关重要。然而,真人测评供不应求,服务商账号质量不一,且存在高权重账号稀缺和黑卡下单风险。因此,许多大卖…...
企企通入选第一新声《2024年中国CIO数字化产品选型白皮书》供应链数字产品可信名录
近日,第一新声研究院根据多年产业数字化研究,历经近半年时间,并综合近200位CIO调研与推荐意见,发布《2024年中国CIO数字化产品选型白皮书》,并推出企业CIO选型指南及可信产品名录。企企通凭借其优秀的采购数字化与供应…...
Linux中 “权限设置修改”
目录 一、权限 (1)权限三大类: (2)文件的权限: (3)目录的权限: (4)用户的角色: 二、文件的权限位 三、修改用户权限 …...
vscode里如何用git
打开vs终端执行如下: 1 初始化 Git 仓库(如果尚未初始化) git init 2 添加文件到 Git 仓库 git add . 3 使用 git commit 命令来提交你的更改。确保在提交时加上一个有用的消息。 git commit -m "备注信息" 4 …...
在 Nginx Stream 层“改写”MQTT ngx_stream_mqtt_filter_module
1、为什么要修改 CONNECT 报文? 多租户隔离:自动为接入设备追加租户前缀,后端按 ClientID 拆分队列。零代码鉴权:将入站用户名替换为 OAuth Access-Token,后端 Broker 统一校验。灰度发布:根据 IP/地理位写…...
【开发技术】.Net使用FFmpeg视频特定帧上绘制内容
目录 一、目的 二、解决方案 2.1 什么是FFmpeg 2.2 FFmpeg主要功能 2.3 使用Xabe.FFmpeg调用FFmpeg功能 2.4 使用 FFmpeg 的 drawbox 滤镜来绘制 ROI 三、总结 一、目的 当前市场上有很多目标检测智能识别的相关算法,当前调用一个医疗行业的AI识别算法后返回…...
有限自动机到正规文法转换器v1.0
1 项目简介 这是一个功能强大的有限自动机(Finite Automaton, FA)到正规文法(Regular Grammar)转换器,它配备了一个直观且完整的图形用户界面,使用户能够轻松地进行操作和观察。该程序基于编译原理中的经典…...
音视频——I2S 协议详解
I2S 协议详解 I2S (Inter-IC Sound) 协议是一种串行总线协议,专门用于在数字音频设备之间传输数字音频数据。它由飞利浦(Philips)公司开发,以其简单、高效和广泛的兼容性而闻名。 1. 信号线 I2S 协议通常使用三根或四根信号线&a…...
人工智能(大型语言模型 LLMs)对不同学科的影响以及由此产生的新学习方式
今天是关于AI如何在教学中增强学生的学习体验,我把重要信息标红了。人文学科的价值被低估了 ⬇️ 转型与必要性 人工智能正在深刻地改变教育,这并非炒作,而是已经发生的巨大变革。教育机构和教育者不能忽视它,试图简单地禁止学生使…...
Razor编程中@Html的方法使用大全
文章目录 1. 基础HTML辅助方法1.1 Html.ActionLink()1.2 Html.RouteLink()1.3 Html.Display() / Html.DisplayFor()1.4 Html.Editor() / Html.EditorFor()1.5 Html.Label() / Html.LabelFor()1.6 Html.TextBox() / Html.TextBoxFor() 2. 表单相关辅助方法2.1 Html.BeginForm() …...
Vite中定义@软链接
在webpack中可以直接通过符号表示src路径,但是vite中默认不可以。 如何实现: vite中提供了resolve.alias:通过别名在指向一个具体的路径 在vite.config.js中 import { join } from pathexport default defineConfig({plugins: [vue()],//…...
PostgreSQL——环境搭建
一、Linux # 安装 PostgreSQL 15 仓库 sudo dnf install -y https://download.postgresql.org/pub/repos/yum/reporpms/EL-$(rpm -E %{rhel})-x86_64/pgdg-redhat-repo-latest.noarch.rpm# 安装之前先确认是否已经存在PostgreSQL rpm -qa | grep postgres# 如果存在࿰…...
Linux部署私有文件管理系统MinIO
最近需要用到一个文件管理服务,但是又不想花钱,所以就想着自己搭建一个,刚好我们用的一个开源框架已经集成了MinIO,所以就选了这个 我这边对文件服务性能要求不是太高,单机版就可以 安装非常简单,几个命令就…...
