Tar the result files after building
npm install wind-plugin-tartar -czf xxx.tar.gz dist，将编译后的dist文件打包成xxx.tar.gz文件。``bashpnpm
pnpm add wind-plugin-tar -D
Options 配置
| Parameter 参数 | Types 类型 | Default 默认值 | Description 描述说明
| ---------- | --------------------- | --------------------------- | ------------
|disable | Boolean | undefined | disable the plugin
是否禁用此插件
vite环境可自动识别，无须配置
其他环境，若未配置此选项，则当为production时启用，否则不启用。
|bundler | String | vite
默认为vite | plugin environment
插件环境
使用插件默认导出的tar方法，需要配置此参数
可选值：vite、rollup、webpack
|dir | String | get from the bundler config
自动从vite中获取输出目录配置 | directory to tar
打包压缩目录
|name | Stirng | {name}{stamp}{project}v{version}{mode}.tar.gz | name of output file
打包压缩文件名
name是从package.json中获取的名称
stamp是时间戳，为yyyyMMddHH格式
project是从package.json里对应字段获取的相关项目信息，没有则为空
version是从package.json中获取的版本号
mode是打包模式，默认从vite中获取，可通过设置mode参数覆盖
|mode | Stirng | get from the bundler config(if supported)
自动从编译配置中获取打包模式（如果支持设置mode的话） | build mode
编译模式
|shell | Stirng | windows: or powershell, others: nodejs default
windows系统将自动使用pwsh或者powershell，其他系统为nodejs默认设置 | the shell to use for the tar command
tar命令运行的shell环境
建议在.env环境变量文件中配置，插件将自动从process.env中获取TAR_SHELL结尾的环境变量作为shell环境
Usage 使用
+ vite
Click to expand configuration about vite点击展开示例
`ts
// vite config
import { defineConfig } from 'vite'
import { tarInVite } from "wind-plugin-tar"; export default defineConfig({
plugins: [
tarInVite() // use default options 使用默认配置
]
})
/ 或者下列指定bundler方式 /
import { defineConfig } from 'vite'
import tar from "wind-plugin-tar";
export default defineConfig({
plugins: [
tar({ bundler: "vite" }) // need to specify the bundler('vite' by default) 需要指定bundler类型(默认是vite)
]
})
`
+ rollup
Click to expand configuration about rollup点击展开示例
ts
// rollup config
import { tarInRollup } from "wind-plugin-tar"; export default {
plugins: [
tarInRollup() // use default options 使用默认配置
]
}
/ 或者下列指定bundler方式 /
import tar from "wind-plugin-tar";
export default {
plugins: [
tar({ bundler: "rollup" }) // need to specify the bundler 需要指定bundler类型
]
}
`
+ webpack
Click to expand configuration about webpack点击展开示例
- webpack 示例
ts
// webpack config
import { tarInWebpack } from "wind-plugin-tar"; module.exports = {
plugins: [
tarInWebpack() // use default options 使用默认配置
]
}
/ 或者下列指定bundler方式 /
import tar from "wind-plugin-tar";
module.exports = {
plugins: [
tar({ bundler: "webpack" }) // need to specify the bundler 需要指定bundler类型
]
}
`
- vue-cli 示例
ts
// vue-cli config
import { tarInWebpack } from "wind-plugin-tar"; module.exports = {
// ...
chainWebpack: (config) => {
config.plugin("wind-plugin-tar").use(tarInWebpack()); // use default options 使用默认配置
},
// ...
}
/ 或者下列指定bundler方式 /
import tar from "wind-plugin-tar";
module.exports = {
// ...
chainWebpack: (config) => {
config.plugin("wind-plugin-tar").use(tar({ bundler: "webpack" })); // need to specify the bundler 需要指定bundler类型
},
// ...
}
`
$3
当项目成功编译后可见如下输出日志：
+ 打包压缩： tar -czf vt2024083115v0.0.0production.tar.gz dist
+ 开始时间： 2024/8/31 15:24:11 -- 结束时间： 2024/8/31 15:24:11
+ 解压命令： tar -xzf vt2024083115v0.0.0production.tar.gz -C . --strip-components=0
bash
# 解压命令小技巧：
tar -xzf xxx.tar.gz -C . --strip-components=0
# -C表示解压目录，其中的"."表示当前目录
# --strip-components表示解压后提取的tar包的目录层级，=1可以忽略根目录（如dist目录），直接得到其子文件夹和文件
``