https://github.com/renzp94/unplugin-build-info

一款将打包信息打印在控制台上的打包插件
https://github.com/renzp94/unplugin-build-info

Last synced: about 1 month ago
JSON representation

一款将打包信息打印在控制台上的打包插件

• Host: GitHub
• URL: https://github.com/renzp94/unplugin-build-info
• Owner: renzp94
• Created: 2024-05-21T02:49:06.000Z (6 months ago)
• Default Branch: main
• Last Pushed: 2024-09-05T00:43:51.000Z (2 months ago)
• Last Synced: 2024-10-09T16:38:59.048Z (about 1 month ago)
• Language: TypeScript
• Homepage:
• Size: 869 KB
• Stars: 8
• Watchers: 1
• Forks: 0
• Open Issues: 0
• Metadata Files:
  • Readme: README.md
  • Changelog: CHANGELOG.md

Awesome Lists containing this project

• awesome-rspack - unplugin-build-info

README

        


  

    

  





  

    

  

  

    

  

  

    

  

  

    

  



# @renzp/unplugin-build-info

一款将打包信息打印在控制台上的插件。

![demo.png](./demo.png)

支持框架：

- `webpack4/webpack5`

- `vite`

- `rollup`

- `rspack`

- `rsbuild`

- `farm`

## Install

```sh

npm i @renzp/unplugin-build-info -D 

```

## Usage

### webpack

```ts

// webpack.config.ts

import BuildInfoWebpackPlugin from '@renzp/unplugin-build-info/webpack'

export default {

  plugins: [BuildInfoWebpackPlugin()]

}

```

### vite

```ts

// vite.config.ts

import { defineConfig } from 'vite'

import BuildInfoVitePlugin from '@renzp/unplugin-build-info/vite'

export default defineConfig({

  plugins: [BuildInfoVitePlugin()],

})

```

### rspack

```js

// rspack.config.js

const BuildInfoRspackPlugin = require('@renzp/unplugin-build-info/rspack')

module.exports = {

  plugins: [BuildInfoRspackPlugin.default()]

}

```

### rsbuild

```ts

// rsbuild.config.ts

import { defineConfig } from '@rsbuild/core'

import BuildInfoRspackPlugin from '@renzp/unplugin-build-info/rspack'

export default defineConfig({

  tools: {

    rspack: {

      plugins: [BuildInfoRspackPlugin()],

    },

  },

})

```

### rollup

```js

// rollup.config.mjs

import BuildInfoRollupPlugin from '@renzp/unplugin-build-info/rollup'

export default {

  plugins: [BuildInfoRollupPlugin()],

}

```

### farm

```ts

// farm.config.ts

import { defineConfig } from '@farmfe/core'

import BuildInfoVitePlugin from '@renzp/unplugin-build-info/vite'

export default defineConfig({

  vitePlugins: [BuildInfoVitePlugin()],

})

```

如果使用的html模板名字不是`index.html`，则可通过`html`参数指定模板名称(vite插件不需要此参数)。注意是文件名称，不是文件路径。

例如：

  - html模板文件路径为：`./src/html/index.html`，则无需指定。

  - html模板文件路径为：`./src/html/app.html`，则需要指定`html: 'app.html'`

> 原因：内部通过匹配资源文件名来进行查找html文件的，默认为index.html，如果不是则需要指定。

```js

import BuildInfoWebpackPlugin from '@renzp/unplugin-build-info/webpack'

export default {

    plugins: [BuildInfoWebpackPlugin({ html: 'app.html'})]

}

```

### Options

```ts

interface Options {

  // html模板文件，默认为index.html，如果使用的html模板不是index.html，则可以使用该选项指定模板文件名称

  html?: string

  // 是否显示项目名称(package.name)

  showName?:boolean

  // 是否显示项目版本号(package.version)

  showVersion?:boolean

  // 项目名称样式

  nameBlockColor?: string

  // 是否显示打包时间

  showTime?:boolean

  // 打包时间样式

  timeBlockColor?: string

  // 是否显示git信息

  showGit?:boolean

  // git信息样式

  gitBlockColor?: string

}

```