'import' and 'export' may only appear at the top level

[chkpnt]

• Operating System: macOS 10.15.7
• Node Version: 14.4.0
• NPM Version: 6.14.4
• webpack Version: 5.1.2
• imports-loader Version: 1.2.0

Expected Behavior

According to #39, imports-loader should work with ES6 modules.

Actual Behavior

I see the same issue as described in #39:

[...]
ERROR in ./src/foobar.js 4:0
Module parse failed: 'import' and 'export' may only appear at the top level (4:0)
File was processed with these loaders:
 * ./node_modules/imports-loader/dist/cjs.js
You may need an additional loader to handle the result of these loaders.
| 
| (function() {
> export let bla = {
|     doSomething: function() {
|         console.log("this is " + this);
 @ ./src/index.js 1:0-31 3:0-15

webpack 5.1.2 compiled with 1 error in 156 ms

Code

Please see the demonstration repo at https://github.com/chkpnt/imports-loader-issue.

How Do We Reproduce?

Just execute npm run-script dev in the demonstration repo.

[cap-Bernardito]

As stated in the error - 'import' and 'export' may only appear at the top level of your file. In other words, import/export don't work inside {}.

You can use CommonJS syntax instead:

let bla = {
    doSomething: function() {
        console.log("this is " + this);
    }
}

module.exports = bla;

const bla = require("./foobar");

bla.doSomething();

Quote from readme - Do not use this option if source code contains ES module import(s)

[chkpnt]

Thanks for the clarification! 👍