How to add a loader in a Vue/Webpack app to support non JS files used in a dependency of a node module

Question

I have a Vue 2 app that uses Webpack, and I am trying to use in it the node module PSD.js, which in itself utilizes CoffeeScript as part of it's dependencies. When I try to compile i get the error:

Module parse failed: Unexpected character '#' (1:0) You may need an appropriate loader to handle this file type,

referring to the the file ./node_modules/coffee-script/lib/coffee-script/register.js that PSD.js installed as part of it's dependencies when I did npm install psd.

Any ideas on how to make this work?

I understand I need to tell the Vue app how to handle .coffee files with a loader, but I have tried installing coffee-loader, coffee, set the vue.config.js to:

module.exports = {
  publicPath: "./",
  configureWebpack: {
    target: "node-webkit",
    node: false,
    module: {
      rules: [
        // ...
        {
          test: /\.coffee$/,
          use: [
            {
              loader: 'coffee-loader'
            }
          ]
        }
      ]
    }
  },
  lintOnSave: false
};

yet still nothing works, I get the same error. I feel it is because I am not using CoffeeScript directly but rather a node module that I AM using, psd.js, is the one using it. That is why I cannot set lang="coffee" in the script tag attribute of my Vue module (I am using vanilla JS to run everything).

thnx in advance

ADDING MORE INFO: I use a boilerplate framework to setup my app, and it initialises the vue/webpack app for me indirectly.

To reproduce, and even though this system is for Adobe plugins, you do not need the Adobe host app to see the issue, do:

npm install -g bombino

Then in a folder of your choosing run:

bombino

and fill in these params when asked:

? Name of panel? Hello World
? Use your custom templates or bombino defaults? Bombino
What tooling preset should be used? Vue-CLI
? Which Vue-CLI template should be used? bombino-vue-bare (Absolute minimum)
? Host apps to include: After Effects
? Base CEF Port (between 1024 and 65534) 8666
? Run npm install for you? Yes

then cd into Hello-World and run npm run serve. You should see the app is compiled correctly and is running on some port (8080 or higher if taken).

Now go back to the root folder and install psd.js: npm install psd then go back into Hello-World and run npm run serve again. This time it will fail to compile with the error I started this question with. Even if you go and install coffee-loader by doing npm install --save coffeescript coffee-loader and change the vue.config.js to be like so:

  publicPath: "./",
  // Thanks Eric Robinson
  configureWebpack: {
    target: "node-webkit", // Set the target to node-webkit (https://webpack.js.org/configuration/target/)
    node: false, // Don't set certain Node globals/modules to empty objects (https://webpack.js.org/configuration/node/),
    module: {
      rules: [
        // ...
        {
          test: /\.coffee$/,
          use: [
            {
              loader: 'coffee-loader'
            }
          ]
        }
      ]
    }
  },
  lintOnSave: false
};

or if you do vue use coffee - all of these result in the same error: the compiler/packager doesn't know how to handle the .coffee file (used as a dependency by psd.js).

Thnx again to anyone who has info