javascript - 如何将文件从 public 复制到 dist？

Question

我有一个公用文件夹，如下所示:

用

构建项目后

"prod": "npm run mlbuild | npm run build"

dist 文件夹如下所示:

但我缺少 config.json、favicon.ico 和 keycloak.json。

如何在build 的过程中将这些文件放入dist 文件夹？

我试过:

  {
    test: /\.(json)(\?v=\d+\.\d+\.\d+)?$/,
    use: [{
      loader: 'file-loader',
      options: {
        name: '[name].[ext]'
      }
    }]
  }

但我想，我不得不提文件夹。

Answer 1

您可以只设置插件 copy-webpack-plugin复制这些文件，将其添加到您的 webpack.config.js 中:

plugins: [
    new CopyWebpackPlugin([{ from: 'public' }])
  ]

和以下要求:const CopyWebpackPlugin = require('copy-webpack-plugin')

另一个解决方案，如果你不想使用 webpack 来做，是在构建后使用一个包将这些文件复制到 dist 文件夹，添加以下脚本:

"postprod": "cpx \"public/*\" dist"

并将包 cpx 添加到您的 devDependencies 列表，运行 npm install cpx --save-dev。因为你给postprod添加了post前缀，所以每次你运行prod脚本，npm都会在之后自动运行postprod因此，它会将 public 文件夹中的所有文件复制到 dist 文件夹。您可以阅读更多关于 npm 脚本的信息 here