CopyWebpackPlugin not copying files when running dev server

Question

what I am trying to achieve

I am trying to synchronise locale files from a yarn workspace to multiple Vue apps in a monorepo so they can be used with i18next in each app. They need to be:

• kept in sync during development
• automatically updated when the translation files get updated
• have them eventually in the dist folder so that they get deployed with the rest of the app (which should happen automatically when the files are in the public folder)

In order to keep the bundle size small, I can't just bundle the whole package - the files need to be copied individually with their original file names and stored in the public folder of each app and the UI library.

the problem

I am trying to configure CopyWebpackPlugin, but I am either

• just getting an initial copy from translation/locales to public/locales on starting up the dev server
• or the dev server ends up in a loop when I try to enable the writeToDisk option, plus it starts flooding the dist folder with hot reload files.

my vue.config.js *

module.exports = {
  devServer: {
    writeToDisk: true,
  },
  configureWebpack: {
    plugins: [
      new CopyPlugin({
        patterns: [
          {
            from: `${path.dirname(
              require.resolve(`@namespace/translations/package.json`)
            )}/locales`,
            to: "./public/locales",
            toType: "dir",
          },
        ],
      }),
    ],
  },

*based on instructions from https://webpack.js.org/plugins/copy-webpack-plugin/, it includes a reference to yarn workspaces

running yarn serve with this config results in a loop. The correct files are copied to the ./public folder, but at the same time, it creates the ./dist folder and floods it with ...hot-update.json files.

if I run yarn build the first time, the locale files get copied to the ./public folder, but not to the ./dist folder (so it seems it copies the files at the end of the process, so the latest files aren't included in the ./dist folder

current folder structure

Monorepo
└── packages
    ├── applications
    │   ├── app1
    │   │   ├── public
    │   │   └── dist
    │   ├── app2
    │   └── ...
    └── common
        ├── translations
        │   └── locales
        │       ├── en-GB
        │       │   └── common.json
        │       └── de-DE
        ├── ui
        └── ...

versions

@vue/cli 4.5.12
webpack@4.46.0
copy-webpack-plugin@6.4.1

---

Any help with getting this setup to work would be very much appreciated.