javascript - 如何使用带有 webpack 的文件加载器保留文件夹结构，但跳过 "src"？

Question

我在 Webpack 4 中使用文件加载器，我正在将一些资源原封不动地复制到 /dist 文件夹中。可以通过提供

名称:“[路径][名称].[ext]”

作为参数，但这会导致保留整个文件夹结构(在我的例子中，还包括 src/ 部分)。我的目标是复制文件的确切路径，但使用 src/ 作为根目录，有人有这方面的经验吗？

Answer 1

Webpack file-loader 接受 name property 的函数.您可以使用它来返回自定义计算路径。

{
    test: /\.(png|jpg|gif)$/,
    use: [{
        loader: 'file-loader',
        options: {
            // name can also be a simple string if it is only path values
            name(file) {

                // generate path dynamically here
                const newPath = '[hash].[ext]';

                return newPath;
            },
        },
    }],
}

此外，如果您真的需要将 Assets 从src 复制到dist，那么可能是webpack-copy-plugin是更好的处理方式。