# @driver-digital/vite-plugin-shopify-clean 中文文档

规范地址：https://npmcn.com/package/%40driver-digital/vite-plugin-shopify-clean/

版本：2\.0\.2
npm 元数据更新时间：2026-10-06T14:35:10.862Z
中文译文更新时间：2026-11-12T20:18:41.726Z
软件包许可：MIT

本文由上游 README 翻译，可能存在偏差，请结合原文核对 API、命令与配置。版权与许可归原作者所有。

原始 npm 页面：https://www.npmjs.com/package/%40driver-digital/vite-plugin-shopify-clean
原文对照：https://npmcn.com/package/%40driver-digital/vite-plugin-shopify-clean/?lang=original

## 关键信息（来自 npm 元数据）

- 包体积（解压后）：18 kB，7 个文件
- 模块格式：ESM + CJS
- TypeScript 类型：包内自带
- Node.js 要求：^20\.19\.0 \|\| \>=22\.12\.0
- 运行依赖：0 个
- peer 依赖：vite \>=6\.0\.0
- 首次发布：2025-09-22T21:15:58.085Z
- 最新版本发布：2026-10-06T14:35:10.709Z
- 近 30 天下载量：10673（2026-10-13 至 2026-11-11，npm 官方下载统计）
- 已发布版本数：12（近 12 个月 9 个）

## 中文简介

正确清理资产文件夹的 Vite 插件

## 安装

```sh
npm install @driver-digital/vite-plugin-shopify-clean
```

也可以使用：`pnpm add @driver-digital/vite-plugin-shopify-clean`、`yarn add @driver-digital/vite-plugin-shopify-clean`、`bun add @driver-digital/vite-plugin-shopify-clean`

## README

# @driver-digital/vite-plugin-shopfy- clean (英语)

清理您 Shopify 主题的 Vite 插件 `assets/` 整个构建和监视期间的文件夹。 它被设计为与Barrel的 [购买虚拟插件](https://shopify-vite.barrelny.com/)。 。 。 .

为何您可能需要这个: 当 Vite 发出 散列文件名时( 例如 ), `app-abc123.js`),更古老的散列文件可以随着时间的推移而积累. 此插件会安全地去除已过时的资产, 所以您 `assets/` 目录保持整洁,您的主题只引用当前文件 .

[GitHub 图像](https://github.com/DriverDigital/vite-plugin-shopify-clean)

[无](https://www.npmjs.com/package/@driver-digital/vite-plugin-shopify-clean)

[问题](https://github.com/DriverDigital/vite-plugin-shopify-clean/issues)

[更改日志](https://github.com/DriverDigital/vite-plugin-shopify-clean/blob/main/CHANGELOG.md)

## 特征

-   清理建筑物开始时上一份清单所列原有资产.
-   通过比较前一份清单与目前的清单——在德夫(观察)和生产建筑中——来去除每次建造之后的陈旧资产.
-   从清单中追踪JS、CSS和资产文件(图像、字体等)。 源图( R)`.map`档案不在清单里 所以没有清理.
-   滚动/声音 `watchMode` (没有env var 需要)来控制表的特定行为.
-   与 Shopify 主题资产目录结构有关的工作.
-   最小配置; 合理的默认值 .

## 安装

```bash
npm i -D @driver-digital/vite-plugin-shopify-clean
```

同伴要求:

-   节点.js: `^20.19.0 || >=22.12.0`
-   维特: `>=6`

## 使用量

在Barrel 旁边的 Vite 配置中添加插件 [购买虚拟插件](https://shopify-vite.barrelny.com/)。 。 。 .

```js
// vite.config.js
import { defineConfig } from 'vite'
import shopify from 'vite-plugin-shopify'
import shopifyClean from '@driver-digital/vite-plugin-shopify-clean'

export default defineConfig({
  build: {
    emptyOutDir: false,
    sourcemap: true
  },
  plugins: [
    shopifyClean({
      // themeRoot: './',
      // manifestFileName: '.vite/manifest.json',
    }),
    shopify({
      tunnel: true,
      themeRoot: ".",
      sourceCodeDir: "frontend"
    })
  ],
})
```

注释:

-   直接输出到您的 Shostify 主题时 `assets/` 文件夹, 设置 `build.emptyOutDir: false`。该插件依赖于先前的构建文件并显示以决定删除什么。 如果Vite先空出目录,则没有什么可比较的,而且清理无法按预期进行(而你一般不希望Vite去擦去您的主题资产).
-   插件期望在您的主题中存在 Vite 列表 `assets/` 目录(默认时间: `assets/.vite/manifest.json`) (中文(简体) ). 如果您的整合将清单写到别处, 请配置 `manifestFileName` 或者说 `themeRoot` 相应.
-   在监视模式下,插件会随着新文件被放出而自动处理清理工作.

## 选项

```ts
interface VitePluginShopifyCleanOptions {
  /**
   * Relative location of the manifest inside the theme's assets directory.
   * Defaults to `.vite/manifest.json` (resolved under `assets/`).
   */
  manifestFileName?: string

  /**
   * Shopify theme root directory (relative to the directory Vite is run from).
   * Defaults to `./`.
   */
  themeRoot?: string
}
```

插件使用的默认 :

-   `manifestFileName`数字 : `.vite/manifest.json`
-   `themeRoot`数字 : `./`

## 如何运作

插件跟踪了Vite的表单(JS,CSS,以及图像和字体等资产文件)所列出的文件,并使用表单比较来确定要清理什么.

-   构建启动( E)`buildStart`(中文(简体) )
    -   若为 `assets/.vite/manifest.json` 已存在(或您配置的路径),插件读取先前释放的资产并删除它们 `assets/` 在新的建筑之前 这可以防止陈旧的文件被遗留在建筑物之间.
-   写入捆绑( E)`writeBundle`(中文(简体) )
    -   在新资产被写入后,插件会将之前的表单与当前表单进行比较. 旧清单中的任何文件如果不再列入新清单,则予以删除。 这样可以处理大楼之间重新命名或去除出入口的情况.

## 更改日志

见 [变动情况](https://github.com/DriverDigital/vite-plugin-shopify-clean/blob/main/CHANGELOG.md) 用于发行笔记.

## 许可证

麻省理工学院

## 鸣谢

由 所建并维持 [驱动数字](https://www.driver-digital.com/)

最初从 [@by-association- only/vite-plugin-shopfy-clean 互联网档案馆的存檔,存档日期2013-12-02](https://github.com/dan-gamble/vite-plugin-shopify-clean) - 非常感谢 [丹·甘布尔](https://github.com/dan-gamble) 为了他的原作.

## 常见问题

### @driver-digital/vite-plugin-shopify-clean 是什么？

正确清理资产文件夹的 Vite 插件

### 如何安装 @driver-digital/vite-plugin-shopify-clean？

在项目目录运行 npm install @driver-digital/vite-plugin-shopify-clean，或使用 pnpm add / yarn add / bun add。它还需要宿主项目提供 peer 依赖：vite（\>=6\.0\.0）。npm 7 及以上与 pnpm 8 及以上默认会自动安装必需的 peer 依赖，Yarn 需要手动安装。

### @driver-digital/vite-plugin-shopify-clean 支持 TypeScript 吗？

支持。包内自带 TypeScript 类型声明（package\.json 声明了 types 入口），安装后即可获得类型提示，无需再安装 @types 包。

### @driver-digital/vite-plugin-shopify-clean 支持 ESM 还是 CommonJS？

同时提供 ES Module 与 CommonJS 入口，import 和 require\(\) 都可以使用，打包工具会自动选择合适的版本。

### @driver-digital/vite-plugin-shopify-clean 需要什么版本的 Node\.js？

package\.json 的 engines 字段要求 Node\.js ^20\.19\.0 \|\| \>=22\.12\.0。版本不符时 npm 默认只给出警告，开启 engine-strict 后会拒绝安装。

### @driver-digital/vite-plugin-shopify-clean 可以商用吗？

@driver-digital/vite-plugin-shopify-clean 使用 MIT 许可。宽松许可：允许商业使用、修改和再分发，通常只需在分发时保留原版权与许可声明。以上为概括，不构成法律意见，请以许可原文为准。

### @driver-digital/vite-plugin-shopify-clean 的下载量有多少？

根据 npm 官方下载统计，@driver-digital/vite-plugin-shopify-clean 在 2026/10/13 – 2026/11/11 这 30 天内被下载 10,673 次，日均约 356 次。下载量会把 CI 构建、镜像同步和作为其他包依赖的安装一并计入，适合横向比较热度，不能直接等同于使用人数。

### @driver-digital/vite-plugin-shopify-clean 还在维护吗？

最新版本 2\.0\.2 发布于 2026/10/06（1 个月前）；至今共发布 12 个版本，其中过去 12 个月发布了 9 个；首次发布于 2025/09/23。发布频率只是参考信号：功能稳定的工具可能很少需要更新，建议结合源码仓库的 issue 和提交记录判断。