前端设置env配置文件yaml/json格式 在项目中读取

1.在public下新建配置文件,我这里用的是yaml格式,获取到后需要用yaml插件解析成json文件

2.安装yaml用于解析yaml

3.在main.ts文件中读取配置文件(因为每次刷新页面 main.ts中的代码都会执行一遍)

封装一个获取配置文件的方法

// 获取本地配置文件
const getFile = (url: string) =>
	new Promise((resolve, reject) => {
		const xhr = new XMLHttpRequest()
//用的是哈希路由 所以有#  以#分割获取到前端所在的域名
		const hostUrl = window.location.href.split('#')[0]
		xhr.open('GET', `${hostUrl}${url}`, true)
		// xhr.overrideMimeType('application/json')
		xhr.send(null)
		xhr.onreadystatechange = () => {
			if (xhr.readyState === 4) {
				if (xhr.status === 200) {
					resolve(xhr.responseText)
				} else {
					reject(xhr)
				}
			}
		}
	})

import { getFile } from './utils/file'
import YAML from 'yaml'
getFile('setting.yaml')
	.then((res: any) => {
		let setFile = YAML.parse(res)
//放到pinia中
		hosipitalStore.setIsIot(setFile ? setFile.iot_wrist : false)
	})
	.catch(() => {
		hosipitalStore.setIsIot(false)
	})