npm package discovery and stats viewer.

Discover Tips

  • General search

    [free text search, go nuts!]

  • Package details

    pkg:[package-name]

  • User packages

    @[username]

Sponsor

Optimize Toolset

I’ve always been into building performant and accessible sites, but lately I’ve been taking it extremely seriously. So much so that I’ve been building a tool to help me optimize and monitor the sites that I build to make sure that I’m making an attempt to offer the best experience to those who visit them. If you’re into performant, accessible and SEO friendly sites, you might like it too! You can check it out at Optimize Toolset.

About

Hi, 👋, I’m Ryan Hefner  and I built this site for me, and you! The goal of this site was to provide an easy way for me to check the stats on my npm packages, both for prioritizing issues and updates, and to give me a little kick in the pants to keep up on stuff.

As I was building it, I realized that I was actually using the tool to build the tool, and figured I might as well put this out there and hopefully others will find it to be a fast and useful way to search and browse npm packages as I have.

If you’re interested in other things I’m working on, follow me on Twitter or check out the open source projects I’ve been publishing on GitHub.

I am also working on a Twitter bot for this site to tweet the most popular, newest, random packages from npm. Please follow that account now and it will start sending out packages soon–ish.

Open Software & Tools

This site wouldn’t be possible without the immense generosity and tireless efforts from the people who make contributions to the world and share their work via open source initiatives. Thank you 🙏

© 2026 – Pkg Stats / Ryan Hefner

add_version_plugin

v1.2.0

Published

npm i add_version_plugin -D

Readme

安装(webpack构建)

npm i add_version_plugin -D 

如果你使用的是vite请使用:
npm i add_version_plugin_vite -D 
https://www.npmjs.com/package/add_version_plugin_vite

更新版本

--version 1.1.7 增加对vue3 项目支持(仅 webpack 打包)
--version 1.1.6 修复之前webpack配置,导致引用打包后的dist/index.js时self报错

在vue2 / vue3 中的使用

1. 找到vue.config.js
2. 导入插件
	const AddVersionPlugin = require('add_version_plugin');
3. 添加package.json信息
	const json_data = require('./package.json');
	const app_infos = {
	  app_name:json_data.name,
	  app_version:json_data.version
	}
	const filename = null; // 可以配置,也可以不配置

3.  进行如下配置
module.exports = defineConfig({
    transpileDependencies: true,
    configureWebpack: {
        plugins: [
			// 调用插件
			new AddVersionPlugin({
				filename: filename,
				app_infos: app_infos,
				content:'这是其他信息!'
			}),
        ],
    }
})

app_infos => 获取项目中package.json 中的项目名称以及版本信息,(为必填字段)
filename => 你想打包后生成的版本文件名称(非必填,默认,不填默认为dist/build_version.md 如上:dist/version.md)
content => 你要在version.md文件中生成的文件内容(非必填,支持JS模板字符串)

更新package.josn里面的软件版本

方案一:手动修改版本
方案二:通过npm 脚本去自动修改<需要自己去配置>
	可以在package.json 中添加script 脚本去解决,每只需要运行编译脚本,便会自动更新version,并打包到新的dist目录中
	可自行了解 如下
	npm version patch (执行一次,变成1.1.2)
	npm version minor (执行一次,变成1.2.1)
	npm version major (执行一次,变成2.1.1)

编译完成目录结构

...
|---NPM_TEST
		|----build_version.md <生成的版本信息>
		|----index.html
		|----favicon.ico
		|----js
		|----css

编译打包生成的版本信息

|name     |value        |
|---------|-------------|
|app_name:|npm_test|
|app_version:| 1.1.12|
|git_branch: |master|
|git_version: |d25666101b2c889a25e2040229d226e1545e5fb5|
|build_user: |zhangxudong - <[email protected]>|
|build_date: |2022-08-17 13:52:16|