uniapp 自定义发行 动态修改 manifest.json

news2024/9/30 7:28:05

这边需求是根据不同的打包环境 设置不同的标题以及路径。方便各种调试。防止 每次手动每次修改 manifest.json 出错

 uniapp 自定义发行:

添加自定义发行之后 Hbuilder 编辑器会自动多 出来按钮

官方文档:概述 | uni-app官网

我这里的配置是这样: package.json

这里主要用于显示两个按钮以及设置相关 字段:

{
	"dependencies": {
		"js-md5": "^0.7.3",
		"moment": "^2.29.4"
	},

	"uni-app": {
		"scripts": {
			"h5_prod": {
				"title": "品创收银台",
				"env": {
					"UNI_PLATFORM": "h5",
					"NODE_ENV": "prod",
					"UNI_OUTPUT_DIR": "dist/build/h5_prod"
				},
				"router": {
					"mode": "history",
					"base": "/payment/h5/"
				},
				"define": {
					"H5_PROD": true
				}
			},
			"h5_uat": {
				"title": "品创收银台uat",
				"env": {
					"UNI_PLATFORM": "h5",
					"NODE_ENV": "uat",
					"UNI_OUTPUT_DIR": "dist/build/h5_uat"
				},
				"router": {
					"mode": "history",
					"base": "/payment/h5_uat/"
				},
				"define": {
					"H5-UAT": true
				}
			}
		}
	}
}

 设置网页标题和 base 路径:

 

动态修改 manifest.json 

需求是 根据发布:  h5_prod / h5_uat  来动态修改  manifest.json 文件

官方文档: uni-app官网

这里需要在 项目根路径下创建vue.config.js 文件

我这里 代码主要是 判断按钮的来源进行处理:

console.log('process.env[UNI_SCRIPT]:', process.env['UNI_SCRIPT'])
if (process.env['UNI_SCRIPT'] == 'h5_prod') {
	replaceManifest('h5.title', '"品创收银台"')
	replaceManifest('h5.router.base', '"/payment/h5/"')
} else if (process.env['UNI_SCRIPT'] == 'h5_uat') {
	replaceManifest('h5.title', '"品创收银台uat"')
	replaceManifest('h5.router.base', '"/payment/h5_uat/"')
}

 完整代码如下:(贴出来的代码 没有删除注释 留作它用)

const fs = require('fs')
//此处如果是用HBuilderX创建的项目manifest.json文件在项目跟目录,如果是 cli 创建的则在 src 下,这里要注意
//process.env.UNI_INPUT_DIR为项目所在的绝对路径,经测试,相对路径会找不到文件
const manifestPath = process.env.UNI_INPUT_DIR + '/manifest.json'
let Manifest = fs.readFileSync(manifestPath, {
	encoding: 'utf-8'
})

function replaceManifest(path, value) {
	const arr = path.split('.')
	const len = arr.length
	const lastItem = arr[len - 1]
	let i = 0
	let ManifestArr = Manifest.split(/\n/)

	for (let index = 0; index < ManifestArr.length; index++) {
		const item = ManifestArr[index]
		if (new RegExp(`"${arr[i]}"`).test(item)) ++i;
		if (i === len) {
			const hasComma = /,/.test(item)
			ManifestArr[index] = item.replace(new RegExp(`"${lastItem}"[\\s\\S]*:[\\s\\S]*`),
				`"${lastItem}": ${value}${hasComma ? ',' : ''}`)
			break;
		}
	}
	Manifest = ManifestArr.join('\n')
}
console.log('process.env[UNI_SCRIPT]:', process.env['UNI_SCRIPT'])
if (process.env['UNI_SCRIPT'] == 'h5_prod') {
	replaceManifest('h5.title', '"品创收银台"')
	replaceManifest('h5.router.base', '"/payment/h5/"')
} else if (process.env['UNI_SCRIPT'] == 'h5_uat') {
	replaceManifest('h5.title', '"品创收银台uat"')
	replaceManifest('h5.router.base', '"/payment/h5_uat/"')
}

fs.writeFileSync(manifestPath, Manifest, {
	"flag": "w"
})

module.exports = {

}

// module.exports = {
// 	chainWebpack: config => {
// 		console.log("process.env.BUILD_TYPE:------------------:", process.env['UNI_SCRIPT'])
// 		console.log("config:------------------:", process['UNI_MANIFEST'])
// 		//console.log("config:------------------:", config)
// 		// config
// 		//   .plugin('define')
// 		//   .tap(args => {
// 		//     args[0]['process.env'].VUE_APP_TEST = '"test"'
// 		//     return args
// 		//   })

// 		if (process.env['UNI_SCRIPT'] == 'h5_prod') {
// 			process['UNI_MANIFEST']['h5']['title'] = '"品创收银台"'
// 			process['UNI_MANIFEST']['h5']['router'] = {
// 				mode: 'history',
// 				base: '/payment/h5/'
// 			}
// 		} else if (process.env['UNI_SCRIPT'] == 'h5-uat') {
// 			process['UNI_MANIFEST']['h5']['title'] = '"品创收银台uat"'
// 			process['UNI_MANIFEST']['h5']['router'] = {
// 				mode: 'history',
// 				base: '/payment/h5_uat/'
// 			}
// 		}
// 		return config
// 		// console.log("config:------------------:", process['UNI_MANIFEST'])
// 		// config
// 		// 	.plugin('define')
// 		// 	.tap(args => {
// 		// 		console.log("args: ", args)
// 		// 		// 在这里也可以写全局的变量
// 		// 		return args
// 		// 	})

// 		// console.log(config.Manifest)
// 		// return config
// 	}
// }
// module.exports = {
// 	defineConfig: Manifest
// }

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

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

相关文章

大数据开发基础-环境配置篇-Hadoop集群安装

鼠鼠接下来将更新一系列自己在学习大数据开发过程中收集的资源、和自己的总结、以及面经答案、LeetCode刷题分析题解。 首先是大数据开发基础篇 环境搭建、组件面试题等 其次是更新大数据开发面经的java面试基础 最后更新一个大数据开发离线数仓的实战项目&#xff0c;自己写入…

利用R中的corrmorant包绘制精美的相关性热图

大家好&#xff0c;我是带我去滑雪&#xff01; 相关性热图 (correlation heatmap) 是一种可视化工具&#xff0c;用于展示数据集中各个变量之间的相关性。它以矩阵的形式显示变量之间的相关系数&#xff0c;并通过色彩编码来表示相关性的强度。在相关性热图中&#xff0c;每个…

html面试题-概念题汇总

文章目录 html面试题汇总 src和href的区别 HMTL的全局属性有哪些&#xff1f; 超链接访问过后hover样式就不出现的原因是什么&#xff1f;怎么解决&#xff1f; 表单中readonly和disabled属性的区别&#xff1f; iframe的优缺点&#xff1f; 浏览器渲染页面的过程 viewport属性…

GO channel解析

GO channel解析 是什么&#xff1f; 官方文档&#xff1a; https://go.dev/ref/spec#Channel_typeshttps://go.dev/blog/pipelines&#xff08;channel提供了流式编程的例子&#xff09; 在 Go 语言中&#xff0c;channel 是一种用于在 goroutine 之间进行通信和同步的机制。…

【FFmpeg实战】音频解码与编码流程

解码流程 音频编解码流程与视频编解码流程一致&#xff0c;我们可以对 mp4 文件的音频流进行解码&#xff0c;并将解码后的音频数据保存到 PCM 文件中&#xff0c;后续我们可以通过读取 PCM 文件中的数据实现音频流的编码操作 FFmpeg音频解码流程 extern"C" { #inc…

ICC2: Create Placement Blockage

area-based的placement blockage有四种,hard、hard macro、soft,partial。hard 属性限制所有standard cell、hard macro放进hard blockage中;hard macro仅限制hard macro(如sram);soft属性限制placement的init_place阶段(也叫coarse placement)把standard cell和hard macro…

Vuex学习

5.1.理解 Vuex 5.1.1.Vuex 是什么 概念&#xff1a;专门在Vue中实现集中式状态&#xff08;数据&#xff09;管理的一个Vue插件&#xff0c;对Vue应用中多个组件的共享状态进行集中式的管理&#xff08;读/写&#xff09;&#xff0c;也是一种组件间通信的方式&#xff0c;且适…

深度学习05-CNN循环神经网络

概述 循环神经网络&#xff08;Recurrent Neural Network&#xff0c;RNN&#xff09;是一种具有循环连接的神经网络结构&#xff0c;被广泛应用于自然语言处理、语音识别、时序数据分析等任务中。相较于传统神经网络&#xff0c;RNN的主要特点在于它可以处理序列数据&#xf…

超全汇总,性能测试常用指标大全(重要)

目录&#xff1a;导读 前言一、Python编程入门到精通二、接口自动化项目实战三、Web自动化项目实战四、App自动化项目实战五、一线大厂简历六、测试开发DevOps体系七、常用自动化测试工具八、JMeter性能测试九、总结&#xff08;尾部小惊喜&#xff09; 前言 两种性能指标 业…

Java又双叒叕“凉”了?

前几天&#xff0c;TIOBE的一份6月编程语言榜单公布&#xff1a;Java退出前三&#xff0c;位居第四。一波Java凉了的言论甚嚣尘上。其实不止Java&#xff0c;python、C、C&#xff0c;哪一个没被提过“凉”... 而现实是&#xff0c;Java的招聘需求依然很大&#xff1a; 不可否…

C++静态和动态链接库导出和使用

1、简介 代码开发过程中会遇到很多已有的函数库&#xff0c;这些函数库是现有的&#xff0c;成熟的&#xff0c;可以复用的代码。现实中每个程序都要依赖很多基础的底层库&#xff0c;不可能每个人的代码都从零开始&#xff0c;因此库的存在意义非同寻常。 本质上来说库是一种…

便携式水质自动采样器助力毒情监测

便携式水质自动采样器可助力毒情监测&#xff1a; 污水涉毒采样检测工作是运用科技手段准确评估监测辖区内毒情形势的重要手段。期间&#xff0c;民警详细了解了生活和工业污水的处理、排放以及服务范围、人口数量等情况&#xff0c;并就污水涉毒采样检测工作达成共识。随后&am…

revit中用幕墙来绘制瓦片屋面和生成土钉墙

一、revit中用幕墙来绘制瓦片屋面 层层叠叠的瓦片在我们绘制时具有复杂性&#xff0c;瓦片既美观又满足一些建筑的需要&#xff0c;下面教大家一个用幕墙来绘制瓦片屋面。 新建一个族样板选择公制轮廓—竖挺&#xff0c;绘制我们的瓦片形状 简单的绘制一个瓦片的形状&#xff0…

JVM学习整理(一)

一、JVM的基本介绍 JVM 是 Java Virtual Machine 的缩写&#xff0c;它是一个虚构出来的计算机&#xff0c;一种规范。通过在实际的计算机上仿真模拟各类计算机功能实现 好&#xff0c;其实抛开这么专业的句子不说&#xff0c;就知道JVM其实就类似于一台小电脑运行在windows或…

ruoyi-vue前后端分离项目实现一体化打包(前后端合并打包)

场景 现在要对ruoyi-vue前后端分离项目&#xff0c;进行一体化打包&#xff0c;即 将前后端项目打在一个jar里面 一体化打包优点 不需要再使用nginx&#xff0c;直接将前端文件放到后端项目里面 改造ruoyi-vue项目 后端改造 1、引入依赖spring-boot-starter-thymeleaf &…

倒计时 1 天 | SphereEx 在 2023 亚马逊云科技中国峰会等你来打卡!

2023 年 6 月 27 - 28 日&#xff0c; “因构建而可见” 2023 亚马逊云科技中国峰会将在上海隆重举行&#xff0c;SphereEx 将携面向新一代数据架构的数据库增强引擎&#xff1a;SphereEx-DBPlusEngine 亮相亚马逊云科技中国峰会&#xff0c;展示分布式数据库、数据安全、信创替…

FFmpeg视频转码关键参数详解

1 固定码率因子crf&#xff08;Constant Rate Factor&#xff09; 固定码率因子&#xff08;CRF&#xff09;是 x264 和 x265 编码器的默认质量&#xff08;和码率控制&#xff09;设置。取值范围是 0 到 51&#xff0c;这其中越低的值&#xff0c;结果质量越好&#xff0c;同…

实力见证丨酷雷曼VR再获2项国家发明专利

近日&#xff0c;酷雷曼公司&#xff08;北京同创蓝天云科技有限公司&#xff09;再次喜获两项发明专利证书:“VR多端协同交互方法及相关设备”、“VR展示用户操作方法及相关设备” 。两项专利均基于酷雷曼3D VR系统发明&#xff0c;进一步优化了目前VR全景触控界面互动性及交互…

企业所得税高是怎么回事?该如何解决?

企业所得税高是怎么回事&#xff1f;该如何解决&#xff1f; 《税筹顾问》专注于园区招商、企业税务筹划&#xff0c;合理合规助力企业节税! 企业所得税高&#xff0c;一般企业都会运用一些税务筹划的方式来解决&#xff0c;那么事前的规划和搭建好业务框架就显得尤为重要。真…

FFmpeg初识

一、简介 它的官网为&#xff1a;https://ffmpeg.org/&#xff0c;由Fabrice Bellard&#xff08;法国著名程序员Born in 1972&#xff09;于2000年发起创建的开源项目。该人是个牛人&#xff0c;在很多领域都有很大的贡献。 FFmpeg是多媒体领域的万能工具。只要涉及音视频领域…