Skip to main content
Skip table of contents

Cross app imports

Importing code from other apps is discouraged, as it creates unclear dependencies and hinders app isolation. This page contains guidance on how to find and address cross app imports.

Finding cross app imports

You can view the cross app import dashboard to see an overview of cross app imports in the vets-website repository. The data used in the report is generated by running the check-cross-app-imports script in the vets-website repository.

BASH
yarn check-app-imports

This script will generate the cross app imports of all application directories, and store them in a JSON file at /tmp/cross-app-imports.json.

To see the cross app imports of a specific application, you can use the app-folders option to specify the names of application directories in src/applications when running the script. This will output the cross app imports of the given application directories to the console.

BASH
# Outputs cross app imports of 'src/applications/hca' if any are found.
yarn check-app-imports --app-folders hca
BASH
# Multiple folders can be separated by a comma.
yarn check-app-imports --app-folders hca,vaos

The output of the script will follow this format for each application:

JSON
{
  "hca": {
    "appsThatThisAppImportsFrom": {
      "personalization": {
        "filesImported": [
          {
            "importer": "src/applications/hca/enrollment-status-helpers.jsx",
            "importee": "src/applications/personalization/dashboard/components/DashboardAlert"
          }
        ]
      }
    },
    "appsThatImportFromThisApp": {
      "personalization": {
        "filesImported": [
          {
            "importer": "src/applications/personalization/dashboard/components/apply-for-benefits/ApplyForBenefits.jsx",
            "importee": "src/applications/hca/actions"
          }
        ]
      }
    },
    "platformFilesThatImportFromThisApp": []
  },
  "vaos": {
    "appsThatThisAppImportsFrom": {},
    "appsThatImportFromThisApp": {},
    "platformFilesThatImportFromThisApp": []
  }
}
  • appsThatThisAppImportsFrom: An object of the applications that the specified app imports from

  • appsThatImportFromThisApp: An object of the applications that import from the specified app

    • personalization: The name of an app directory in src/applications

      • filesImported: An array of objects containing the imports

        • importer: The path of a file that imports from another app file (the importee)

        • importee: The path of a file that is being imported by another app (the importer)

  • platformFilesThatImportFromThisApp: An array of paths to files in src/platform that import from the specified app

When no cross app imports relating to the application are found, the script will return the following output:

BASH
No cross app imports were found!

Common types of cross app imports

There are a few common cross app imports that you may see when examining the imports. These imports can usually be avoided by taking an alternative approach.

Helper functions

You may come across a helper or utility function in another app that you’d like to use in your app. Rather than importing the function directly from the other app, the helper function should ideally be added to the src/platform directory in the appropriate location. Utilities that need to be used in multiple apps are good candidates for being added to the platform code. This ensures that other developers can find these functions. You can submit a support request in #vfs-platform-support to the Release Tools Team to get assistance with adding the helper function to the platform directory.

Root URLs

There are instances where apps may need to reference the root URL of another app. Rather than importing the app’s manifest, you can use the getAppUrl helper function from the registry helpers. This helper function uses the given entry name, and gets the app’s root URL from the registry in the content-build directory.


JavaScript errors detected

Please note, these errors can depend on your browser setup.

If this problem persists, please contact our support.