webpack-contrib/expose-loader

Exposing a class converts it to an esmodule object

julesrx opened this issue · 2 comments

Bug report

Actual Behavior

Exposing a class converts it to an esmodule object. The object is then not considered as a class, and I cannot use its constructor.
However, the class is present on the default property.

image

This is particularly annoying when using libraries that exports as default classes (ie. DevExtreme).

Expected Behavior

The class should be directly accessible on the window object, as it is a default import.

How Do We Reproduce?

// main.js
import MyClass from 'expose-loader?exposes=MyClass!./my-class.js';

console.log(window.MyClass);
console.log(MyClass);
// my-class.js
class MyClass {
  constructor(id) {
    this.id = id;
  }
}

export default MyClass;
// webpack.config.js
const path = require('path');

module.exports = {
  entry: './main.js',
  output: {
    path: path.resolve(__dirname, 'dist'),
    filename: 'main.bundle.js',
  },
};
{
  "scripts": {
    "build": "webpack"
  },
  "devDependencies": {
    "webpack": "^5.66.0",
    "webpack-cli": "^4.9.1",
    "expose-loader": "^3.1.0"
  }
}

Bundle result
image

npx webpack-cli info:

  System:
    OS: Windows 10 10.0.19044
    CPU: (8) x64 Intel(R) Core(TM) i7-4790 CPU @ 3.60GHz
    Memory: 3.73 GB / 15.95 GB
  Binaries:
    Node: 16.10.0 - C:\Program Files\nodejs\node.EXE
    Yarn: 1.22.17 - C:\Program Files\nodejs\yarn.CMD
    npm: 8.1.2 - C:\Program Files\nodejs\npm.CMD
  Browsers:
    Edge: Spartan (44.19041.1266.0), Chromium (97.0.1072.55)
    Internet Explorer: 11.0.19041.1202
  Packages:
    expose-loader: ^3.1.0 => 3.1.0
    webpack: ^5.66.0 => 5.66.0
    webpack-cli: ^4.9.1 => 4.9.1

Expected, because you use export default MyClass;, try to use import MyClass from 'expose-loader?exposes=MyClass.default!./my-class.js';

This worked. Thanks 👍