CODEWITHSUNDEEP
javascriptvisual-studio-code
ted
ted

Reputation: 14684

Javascript VSCode function definition broken with module exports

I'm working on a Chrome extension and have a set of js files imported in the extension's popup in <script defer src="../utils/X.js"></script> tags.

The folder structure looks like

src/
  utils/
    parser.js
    functions.js
    other.js
  popup/
    popup.js
    popup.html

popup.js uses functions from files in utils/ and the files in utils/ use each other's functions.

All was going well and I could navigate to function definitions with cmd+click

As I integrated tests, and to be able to test my functions in a node environment (mocha) I added the following at the bottom of my util files:

if (typeof module !== "undefined" && module.exports != null) {
    module.exports = {
        log,
        ...
    };
}

And that breaks VSCode's ability to Go to Definition, not sure why or how to fix it.

For reference, here's my jsconfig.json:

{
    "compilerOptions": {
        "module": "commonjs",
        "target": "es6",
    },
    "include": [
        "src/**/*.js"
    ]
}

Upvotes: 0

Views: 259

Answers (1)

ted
ted

Reputation: 14684

The problem comes from VSCode's JS and TS language features relying on module.exports = {...} to determine whether a file should be treated as a script or a module. A workaround is therefore to trick it with the following:

if (typeof module !== "undefined" && module.exports != null) {
    var dummyModule = module;
    dummyModule.exports = {
        log,
        ...
    };
}

Upvotes: 0

Related Questions