ctrl+shift+p filters: :st2 :st3 :win :osx :linux
Browse

Dependents

by mrjoelkemp ST3

Sublime Text plugin for navigating front-end (JS/Sass) codebases

Details

Installs

  • Total 125
  • Win 27
  • OS X 82
  • Linux 16
Mar 1 Feb 28 Feb 27 Feb 26 Feb 25 Feb 24 Feb 23 Feb 22 Feb 21 Feb 20 Feb 19 Feb 18 Feb 17 Feb 16 Feb 15 Feb 14 Feb 13 Feb 12 Feb 11 Feb 10 Feb 9 Feb 8 Feb 7 Feb 6 Feb 5 Feb 4 Feb 3 Feb 2 Feb 1 Jan 31 Jan 30 Jan 29 Jan 28 Jan 27 Jan 26 Jan 25 Jan 24 Jan 23 Jan 22 Jan 21 Jan 20 Jan 19 Jan 18 Jan 17 Jan 16
Windows 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0
OS X 1 1 1 3 2 0 0 1 0 1 0 0 0 1 0 0 0 2 0 1 0 0 1 0 0 0 0 1 0 0 0 0 0 0 0 0 0 1 0 1 1 0 0 1 0
Linux 0 0 0 0 0 0 1 0 0 0 0 4 0 0 0 0 1 0 0 0 0 1 0 1 0 0 0 0 0 0 0 0 0 0 1 0 0 0 0 0 0 1 0 0 0

Readme

Source
raw.​githubusercontent.​com

Dependents

Sublime Text 3 plugin for navigating front-end (JS/Sass) codebases

Currently supporting: AMD, CommonJS, ES6, and Sass codebases.

  1. Installation
  2. Usage
  3. Configuring Settings
  4. Troubleshooting
  5. Old Issues
  6. Reporting an Issue
  7. Contributing to Dependents

Installation

Install Dependents via Package Control.

Don't see it? Try reinstalling Package Control. Altenatively, add the repository and install it:

  1. Package Control -> Add Repository
  2. Enter https://github.com/mrjoelkemp/Dependents
  3. Package Control -> Install Package
  4. Choose Dependents

If it doesn't work, please file an issue.

Usage

Find the dependents of the current module

Dependents are files that immediately depend/require/import the current file.

CMD + Option + Up arrow, to trigger finding the dependents.

  • If dependents are found, you'll see them in a dropdown.
    • You can select any of the items in the panel to jump to that file
    • If there's only one dependent, you'll be taken to that dependent file directly.
  • If no dependents are found a popup will be shown

You can also open all of the dependents at once via:

  1. Within a file, right click to open up a menu
  2. Click on Dependents -> Open all dependents to open all dependent files in the editor

Jump to a dependency

Quickly jump to a file that the current file @imports or requires

  1. Within a file, place your cursor over the dependency path you want to go to
  2. Press CMD + Option + Right arrow or CMD + Option + Click to jump to that file
    • If a dependency is aliased, you'll need to supply the path to your requirejs configuration

Find relevant app entry points

Find relevant application entry points that depend on the current file somewhere within their dependency tree

  1. Within a file, right click to open the context menu
  2. Click on Dependents -> Find relevant app entry points

You can also open all relevant app entry points at once via:

  1. Within a file, right click to open the context menu
  2. Click on Dependents -> Open all relevant app entry points

View dependency tree

View a snapshot of the current file's dependency tree (as a JSON file)

  1. Within a file, right click to open the context menu
  2. Click on Dependents -> View this file's dependency tree

Configuring settings

  • root: the location where your JS files reside.
  • config: (Optional) the path to your requirejs configuration file
  • sass_root: (Optional) the path to your Sass files
  • exclude: (Optional) a list of paths and/or folder names to exclude from the search for dependents
    • Omitting folders that contain 3rd party libraries can drastically speed up the search for a large codebase.
    • The following folders are excluded by default: node_modules, bower_components, vendor
    • Note: Subdirectories are not supported; you can't supply some/sub/folder as an exclusion
  • build_config: (Optional) path to your RequireJS Build configuration json file
    • This should have a “modules” section that lists your bundles (entry points)
    • Supplying this yields a significant performance speedup when finding relevant app entry points
  • node_path: (Optional) path to your node installation. Defaults to /usr/local/bin on OSX

You can define these settings on a per-project basis by creating a .deprc file in the main directory of your codebase.

Configure the settings above within the .deprc file by adding:

{
  "root": "public/assets/js",
  "config": "public/assets/js/config.js",  # Optional
  "sass_root": "public/assets/sass",       # Optional
  "exclude": ['jquery.js', 'require.js'],  # Optional
  "build_config": "public/assets/js/build.json", # Optional
  "node_path": "/my/node/install/folder"   # Optional
}

Alternatively, you can specify the settings by going to

Preferences -> Package Settings -> Dependents -> Settings - User

and adding your configuration.

Default key bindings

By default, the following key bindings have been supplied:

OSX:

  • Find Dependents: CMD + Option + Up arrow
  • Jump to dependency: CMD + Option + Right arrow or CMD + Option + Click

Windows and Linux:

  • Find Dependents: Control + Alt + Up arrow
  • Jump to dependency: Control + Alt + Right arrow or Control + Option + Click

You can also trigger the commands via:

  • File -> Dependents
  • Right click -> Dependents

Custom key bindings

If you would like to specify custom keybindings, you can override them in Preferences -> Key Bindings - User

like so:

[
  {
    "keys": ["super+alt+up"],
    "command": "dependents"
  },
  {
    "keys": ["super+alt+right"],
    "command": "jump_to_dependency",
  }
]
  • You won't need the opening and closing square brackets [] if you have pre-existing key bindings
  • For bindings for Finding relevant app entry points, the command is find_driver.

Troubleshooting

If you're having trouble using Dependents, please check your console for errors: View -> Show Console

  • File an issue with an error message

Reporting an issue

You can get console logs via View -> Show Console.

Paste those logs into the body of your issue.

Or ping me @mrjoelkemp