vite使用define定义项目打包信息
由于项目多人开发,想要在控制台查看当前运行包的具体信息包括(build时间、代码分支、打包人、最后一次提交记录等等),通过查阅vite文档发现define可以解决这个问题,具体如下
首先在vite.config.js中进行配置
// 在vite.config.js中定义一个项目信息
import { defineConfig } from 'vite'
const __APP_INFO__ = {
buildTime: dayjs().format('YYYY-MM-DD HH:mm:ss'),
// ...
};
export default defineConfig(({ command, mode }) => {
return {
// vite 配置中增加字段
define: {
__APP_INFO__: JSON.stringify(__APP_INFO__),
},
}
})
随后在App.vue中定义window变量
<template>
<router-view />
</template>
<script>
import { onMounted } from 'vue';
export default {
setup() {
onMounted(() => {
if (__APP_INFO__) {
window.__APP_INFO__ = __APP_INFO__;
}
});
},
};
</script>
<style>
</style>
结果如下: