webpackmeteorbabeljsvscode-jsconfig

Passing options to js compiler on meteor


We are adding a jsconfig file to the root of a meteor project to add short hands form imports.

For instance instead of import UserMutations from '../../api/Users/mutations'; we would like to write import UserMutations from '@api/Users/mutations';

This is an example jsconfig file

{
  "compilerOptions": {
    "baseUrl": ".",
    "paths": {
      "@api/*": ["api/*"],
    }
  }
}

When we add this our short hand imports recognized as npm packages that are missing.

Any help is appreciated


Solution

  • Meteor's build system uses babel under the hood. So, you can solve your task with a plugin 'module-resolver':

    Install npm package:

    meteor npm i babel-plugin-module-resolver

    Create .babelrc at the root of your meteor project:

    {
      "plugins": [
        [
          "module-resolver",
          {
            "alias": {
              "@api": "./imports/api"
            }
          }
        ]
      ]
    }
    

    Then import

    imports
    api
       users
          index.js
          utils.js
    ...
    
    import { Users } from '@api/users';
    import { SomeUtils } from '@api/users/utils.js';