Export build information as virutal module.
This plugin helps you add build timestamp / commit SHA / ... to your application. So you can easily check whether the production version meets your expectations.
This pacakge was originally named vite-plugin-info. Now it has been refactored using unplugin to support more tools.
However, you can still use vite-plugin-info since it works fine. Thanks to the compatibility of Vite. And the source code of vite-plugin-info is here.
npm i -D unplugin-info
Vite
// vite.config.ts
import Info from 'unplugin-info/vite';
export default defineConfig({
plugins: [
Info()
]
});
Rollup
// rollup.config.js
import Info from 'unplugin-info/rollup';
export default {
plugins: [
Info()
]
};
Webpack
// webpack.config.js
module.exports = {
/* ... */
plugins: [
require('unplugin-info/webpack')()
]
};
Nuxt
// nuxt.config.ts
export default defineNuxtConfig({
modules: ['unplugin-info/nuxt']
});
Vue CLI
// vue.config.js
module.exports = {
configureWebpack: {
plugins: [
require('unplugin-info/webpack')()
]
}
};
Quasar
// quasar.conf.js [Vite]
module.exports = {
vitePlugins: [
[
'unplugin-info/vite',
{
/* options */
}
]
]
};
// quasar.conf.js [Webpack]
const Info = require('unplugin-info/webpack');
module.exports = {
build: {
chainWebpack(chain) {
chain.plugin('unplugin-info').use(
Info()
);
}
}
};
esbuild
// esbuild.config.js
import { build } from 'esbuild';
build({
/* ... */
plugins: [
require('unplugin-info/esbuild')({
/* options */
}),
],
});
Astro
// astro.config.mjs
import Info from 'unplugin-info/astro';
export default defineConfig({
integrations: [
Info()
],
});
unplugin-info
creates several virtual modules, ~build/time
, ~build/git
, ~build/ci
, ~build/package
, and ~build/meta
.
You can just import these modules as usual, and do anything with them. Common use cases may be like:
// main.ts
import now from '~build/time'
import { sha } from '~build/git'
// console log the build info
console.log(`Build ${sha} at ${now}`)
// App.tsx
import now from '~build/time'
// Render it in your app
function App() {
return <span>{now.toLocaleString()}</span>
}
It exports the timestamp when the vite started.
import now from '~build/time'
console.log(now)
// There will be a log like "Fri Jun 24 2022 16:30:30 GMT+0800 (**标准时间)"
It exports the infomation about the current git repo, which is powered by git-repo-info.
import {
github,
sha,
abbreviatedSha,
tag,
lastTag,
commitsSinceLastTag,
committer,
committerDate,
author,
authorDate,
commitMessage
} from '~build/git';
// ...
Note
From
unplugin-info@0.6.0
, the original virtual module called~build/info
will be renamed to~build/git
, and the CI/CD related information will be moved to another virtual module called~build/ci
.While to avoid break changes to your apps, you can still use
~build/info
with no changes. But we recommend you migrate to the~build/git
and~build/ci
.
It exports the current CI/CD environment information, which is powered by ci-info.
import { isCI, isPR, name } from '~build/ci'
It exports some meta data from the options of the plugin.
// vite.config.ts
export default defineConfig({
plugins: [
BuildInfo({
meta: { message: 'This is set from vite.config.ts' }
})
]
})
Then you can import them in your Vite app.
import { message } from '~build/meta'
console.log(message)
// This is set from vite.config.ts
Note
Meta data will be serialized to JSON format, so you should gen it in you
vite.config.ts
and pass the result object.
To get TypeScript support, you can add type declaration in your env.d.ts
(It is include in the official Vite project template).
declare module '~build/meta' {
export const message: string;
}
It exports the information of the current package.json
.
import { name, version } from '~build/package';
MIT License © 2023 XLor