如何将静态文件夹复制到Vite中的“dev”和“build”？

Question

我正在尝试将基于 Webpack 的 Vue.js 项目升级到 Vite。我有这样的文件夹结构：

 - src/
 - static/
 - tests/

在 Webpack 中，我像这样使用 CopyWebPackPlugin：

 - src/
 - static/
 - tests/

并复制静态文件夹内的所有文件，使其在开发和构建上都可用。

我想通过 Vite 做同样的事情，但不知道如何实现它。

我尝试了以下代码，但没有成功。

new CopyWebpackPlugin([
  {
    from: path.resolve(__dirname, '../static'),
    to: '',
    ignore: ['.*']
  }
]),

Answer 1

以下更改应与您之前的CopyWebpackPlugin设置等效：

\n

\n

1. vite-plugin-static-copy不支持显式ignore选项，但您可以设置srcglob 模式以排除点文件。

   \n
\n

2. 应该dest是\'./\'将文件复制到输出目录的根目录中（默认为dist）。

   \n
\n

\n

import { defineConfig } from \'vite\'\nimport { viteStaticCopy } from \'vite-plugin-static-copy\'\nimport path from \'path\'\n\nexport default defineConfig({\n  plugins: [\n    viteStaticCopy({\n      targets: [\n        {\n          src: path.resolve(__dirname, \'./static\') + \'/[!.]*\', // 1\xef\xb8\x8f\xe2\x83\xa3\n          dest: \'./\', // 2\xef\xb8\x8f\xe2\x83\xa3\n        },\n      ],\n    }),\n  ]\n})\n

\n

演示

\n