Module parse failed for wasm module generated by rust wasm-pack

Question

I have been following this tutorial: https://developer.mozilla.org/en-US/docs/WebAssembly/Rust_to_wasm in order to build a Rust library and use it in a VueJS project.

When I run $ wasm-pack build --target web everything compiles fine and a pkg directory is created properly.

I then import my rust function into a typescript file like:

import { run } from '../../../../Rust/skunk/pkg/skunk_lib';

My package.json looks like this:

{
  "name": "skunk_interactive",
  "version": "0.1.0",
  "private": true,
  "scripts": {
    "serve": "vue-cli-service serve",
    "build": "vue-cli-service build",
    "test:unit": "vue-cli-service test:unit",
    "lint": "vue-cli-service lint"
  },
  "dependencies": {
    "core-js": "^3.6.5",
    "primeicons": "^5.0.0",
    "primevue": "^3.12.6",
    "vue": "^3.0.0",
    "vue-class-component": "^8.0.0-0",
    "vue-router": "^4.0.0-0",
    "vuex": "^4.0.0-0"
  },
  "devDependencies": {
    "@types/jest": "^24.0.19",
    "@typescript-eslint/eslint-plugin": "^4.18.0",
    "@typescript-eslint/parser": "^4.18.0",
    "@vue/cli-plugin-babel": "~4.5.17",
    "@vue/cli-plugin-eslint": "~4.5.17",
    "@vue/cli-plugin-router": "~4.5.17",
    "@vue/cli-plugin-typescript": "~4.5.17",
    "@vue/cli-plugin-unit-jest": "~4.5.17",
    "@vue/cli-plugin-vuex": "~4.5.17",
    "@vue/cli-service": "~4.5.17",
    "@vue/compiler-sfc": "^3.0.0",
    "@vue/eslint-config-typescript": "^7.0.0",
    "@vue/test-utils": "^2.0.0-0",
    "@wasm-tool/wasm-pack-plugin": "^1.6.0",
    "eslint": "^6.7.2",
    "eslint-plugin-vue": "^7.0.0",
    "typescript": "~4.1.5",
    "vue-jest": "^5.0.0-0",
    "webpack": "^4.46.0",
    "webpack-cli": "^4.9.2"
  },
  "eslintConfig": {
    "root": true,
    "env": {
      "node": true
    },
    "extends": [
      "plugin:vue/vue3-essential",
      "eslint:recommended",
      "@vue/typescript/recommended"
    ],
    "parserOptions": {
      "ecmaVersion": 2020
    },
    "rules": {},
    "overrides": [
      {
        "files": [
          "**/__tests__/*.{j,t}s?(x)",
          "**/tests/unit/**/*.spec.{j,t}s?(x)"
        ],
        "env": {
          "jest": true
        }
      }
    ]
  },
  "browserslist": [
    "> 1%",
    "last 2 versions",
    "not dead"
  ],
  "jest": {
    "preset": "@vue/cli-plugin-unit-jest/presets/typescript-and-babel",
    "transform": {
      "^.+\\.vue$": "vue-jest"
    }
  }
}

When I try run npm run serve I get the following error:

Module parse failed: Unexpected token (237:57)
File was processed with these loaders:
 * ./node_modules/cache-loader/dist/cjs.js
 * ./node_modules/babel-loader/lib/index.js
 * ./node_modules/eslint-loader/index.js
You may need an additional loader to handle the result of these loaders.
|           case 0:
|             if (typeof input === 'undefined') {
>               input = new URL('skunk_lib_bg.wasm', import.meta.url);
|             }
| 

I have had a look at this github issue: https://github.com/rustwasm/wasm_game_of_life/issues/22, where it says that updating your webpack should solve the issue. That post was years ago, and I have the latest version of webpack, and still this error persists.

I also introduced a webpack.config.js file, though im not entirely sure what should go in it.

Any thoughts on what might be going wrong?