sapphi-red/vite-plugin-static-copy

# vite-plugin-static-copy [](https://badge.fury.io/js/vite-plugin-static-copy)  [](LICENSE) 支持开发服务器的 Vite 版 [`rollup-plugin-copy`](https://www.npmjs.com/package/rollup-plugin-copy)。 ## 安装 ``` npm i -D vite-plugin-static-copy # yarn add -D vite-plugin-static-copy ``` ## 用法 将 `viteStaticCopy` 插件添加到 `vite.config.js` / `vite.config.ts` 中。 ``` // vite.config.js / vite.config.ts import { viteStaticCopy } from 'vite-plugin-static-copy' export default { plugins: [ viteStaticCopy({ targets: [ { src: 'bin/example.wasm', dest: 'wasm-files', }, ], }), ], } ``` 例如，如果你使用上述配置，你将能够通过 `fetch('/wasm-files/example.wasm')` 获取 `bin/example.wasm`。 因此，文件将被复制到 `dist/wasm-files/example.wasm`。 ### 选项 请参阅 [options.ts](https://github.com/sapphi-red/vite-plugin-static-copy/blob/main/src/options.ts)。 ### 调试 你可以通过设置 `DEBUG` 环境变量来启用详细日志记录： ``` DEBUG=vite:plugin-static-copy npm run dev ``` 当启用调试日志时，插件将输出每个 URL 提供的是哪个文件。 ## 与 `rollup-plugin-copy` 的区别 - 比 `rollup-plugin-copy` 在 `buildStart` 钩子上使用时的开发服务器启动速度更快。 - 开发期间文件不会被复制，而是直接从服务器提供，以减少启动时间。 - `dest` 是相对于 [`build.outDir`](https://vitejs.dev/config/build-options.html#build-outdir) 的路径。 - 如果你打算将文件复制到 `build.outDir` 之外，可以使用 `rollup-plugin-copy`。因为那不需要开发服务器支持。 - 使用 [`tinyglobby`](https://www.npmjs.com/package/tinyglobby) 代替 [`globby`](https://www.npmjs.com/package/globby)。 - 因为 `vite` 内部使用的是 `tinyglobby`。 - `transform` 可以返回 `null` 来告知插件不要复制文件，这类似于 [CopyWebpackPlugin#filter](https://webpack.js.org/plugins/copy-webpack-plugin/#filter) 选项，但它期望 `transform` 在你希望复制文件时返回原始内容。 - `transform` 可以选择是一个对象，包含一个 `handler` 属性（具有与 `rollup-plugin-copy` transform 选项相同的签名）和一个 `encoding` 属性（`BufferEncoding | 'buffer'`），该属性将用于读取文件内容，以便 `handler` 的 content 参数能反映正确的编码（可以是 Buffer）； - `structured: true` 保留目录结构。这类似于 `rollup-plugin-copy` 中的 `flatten: false`，但它涵盖了更多的边缘情况。

标签：CMS安全, JavaScript, MITM代理, rollup-plugin-copy, TypeScript, Vite 插件, WebAssembly, 前端工程化, 安全插件, 开发服务器, 文件拷贝, 模块打包, 自动化攻击, 自动化攻击, 资源管理, 零配置, 静态文件服务, 静态资源复制