How to Fix a Missing Layer or Property Bug

Very rarely, you might run into a strange bug where your animation file won't open and you see an error window that says "Flow was unable to locate a layer or property named"... Follow along to see how you can triage your file.

Download this broken file:

missingPropertyExample.flow

Strap yourself in for a bit of the matrix.

A Missing Layer or Property

In some very rare cases, your Flow file can get out of sync with itself (or your Sketch file… we haven’t really nailed down which one). If this happens to you, and you get a window like this:

This is actually easy to fix.

Open the Broken File

When a file breaks like this you won’t be able to double-click it. So, to get this error you’ll have to open it from Flow’s menu.

This step starts at 0:12

In Flow…

Go to File > Open
Choose the missingPropertyExample.flow file you just downloaded.

Deeeenied…

A Flow File is a Directory

The .flow is a lovely extension name, but really a Flow file is directory in disguise. You can easily see its contents by:

Right-click on missingPropertyExample.flow
Choose Show Package Contents

You’ll see the guts of the Flow file looks something like this:

flowFileFolderStructure — A smorgasbord of folders, JSON files and assets.

We’ll dive into this structure in another doc. So for now…

Find the Broken Reference

To fix your file you need to find the broken reference in the file.

Select the property id and copy it (from the dialog window)
Drag missingPropertyExample.flow into your fav text editor (I use Sublime)
In your opened project, do a search for the property id (e.g. F908BEDF-6559-4393-954F-3DED1A25092D)

findTheReference — There's 1 reference to the missing property.

The Missing Property

The most likely explanation for this bug is that a layer was deleted from your Sketch file, and your flow file wasn’t able to sync properly. In our case, the property looks like this:

"F908BEDF-6559-4393-954F-3DED1A25092D" : {
  "properties" : {
    "position.x" : 2227
  }
},

It looks like an x position for a property…

To fix your file, simply delete the entire reference above, so that this…

Becomes this…

Save the edited .json file, then open missingPropertyExample.flow again.

Wham.