如何使用 React 和 Webpack 复制 sitemap.xml 来构建文件夹？

Question

我在 public 文件夹中有一个 sitemap.xml 文件。当我构建 React 应用程序时，sitemap.xml 文件不在 dist/build 文件夹中。

需要什么 Webpack 配置才能实现？ robots.txt需要怎么设置？

Answer 1

这里是 webpack-config 用于提供文件以使用自定义名称构建文件夹

module: {
    rules: [
        {
            test: /\.(ts|js)x?$/,
            exclude: /node_modules/,
            use: [
                {
                    loader: 'babel-loader',
                },
            ],
        },
        {
            test: /\.css$/,
            use: ['style-loader', 'css-loader'],
        },
        {
            test: /\.(?:ico|gif|png|jpg|jpeg|xml)$/i,
            type: 'asset/resource',
        },
        {
            test: /\.xml/,
            type: 'asset/resource',
            generator: {
                filename: 'sitemap.xml',
            },
        },
        {
            test: /\.txt/,
            type: 'asset/resource',
            generator: {
                filename: 'robots.txt',
            },
        },
        {
            test: /\.(woff(2)?|eot|ttf|otf|svg|)$/,
            type: 'asset/inline',
        },
    ],
},

最后确保将该文件导入到您的 React 应用程序中，否则它将无法用于构建文件夹