如何使用Webpack将资产从输入目录复制到输出目录?

js81xvg6  于 2023-03-08  发布在  Webpack
关注(0)|答案(2)|浏览(151)

假设我的条目是:

counters
   block.json
   counters.css
   counters.php
   counters.js

我想只处理counters.js,并将所有其他文件复制到输出目录。如何使用webpack?哪个工具?

efzxgjgh

efzxgjgh1#

我发现了这一点(只复制相关代码):

entry: {
    counters: ['./blocks/counters/counters.js', './blocks/counters/block.json', './blocks/counters/counters.css', './blocks/counters/counters.php'],
  },

然后:

module: {
    rules: [
      {
        test: /\.json|\.css|\.php/,
        type: 'asset/resource',
        generator: {
          filename: '../[path]/[name][ext]'
        }
      },

      {
        test: /\.m?js$/,
        exclude: /node_modules/,
        use: {
          loader: "babel-loader",
          options: {
            plugins: ['lodash'],
            presets: ['@babel/preset-env'],
            cacheDirectory: true
          }
        }
      }, // babel
    ] // rules
  }, // module

这会将所有文件从/blocks/counters复制到/build/blocks/counters,编译counters.js,其他文件保持原样。

lf3rwulv

lf3rwulv2#

您可以使用CopyWebpackPlugin
示例:

plugins: [
  new CopyWebpackPlugin([
    {
      from: path.resolve(__dirname, './counters/filename'),
      to: path.resolve(__dirname, './output')
    }
  ])
],

相关问题