By josh / June 3, 2014

How to get even the trickiest relative paths right–every time

It’s got to be the most frustrating problem in programming.

You add a new file to your program, maybe a whizbang jQuery plugin.

Then you start coding away, incorporating it into your site.

But when you go to test it … nothing. It silently fails.

You double check your syntax, looks OK.

No errors in the console.

What the … ?

After 20 minutes of reading Stack Overflow posts and checking Github issues, you get a flash of inspiration …

Yep, that’s it. Wrong path. File wasn’t even getting included on the page.

It’s happened to me a hundred times. I can never remember whether I need to use /my_folder? Or maybe ../my_folder? Or just my_folder?

This has bitten me so many times that my first step whenever I link in a new file is to do some kind of “hello world” test, either literally writing out “hello world” (if it’s a JavaScript file) or maybe changing the background color of the page to red (if it’s CSS).

This week I stumbled across an awesome Sublime plugin that eliminates this mistake entirely. It’s called FuzzyFilePath.

With this plugin installed, you can just start typing the name of your file in your document, and you’ll get an autocomplete list of available files, which you can filter with fuzzy matching.

Using a post-processor like Sass or Compass? FuzzyFilePath has you covered, allowing you exclude certain file extensions or folders from the list of suggestions.

FuzzyFilePath is available in Package Control. Unfortunately it only supports Sublime Text 3 at the moment.

P.S. Is there a problem in your workflow that trips you up regularly? It could be great fodder for your own plugin.

Creating one is not that difficult, even if you’ve never written a plugin before and don’t know a bit of Python.

For more about writing your own plugins and achieving Sublime mastery, sign up for the Sublime Text Tips newsletter.

About the author


Click here to add a comment

Leave a comment: