Thanks for the tutorial! I’m new to Vue (and modern JS dev generally), so you introduced me to the idea of a component definition file referenced using a webpack alias — I love the idea of not having to worry about relative paths when importing components.

I tried implementing this in my own project, with oddly erratic results. Sometimes components imported using this method would be registered and displayed properly, and sometimes Vue would throw this error:

Unknown custom element: <my-component> - did you register the component correctly? For recursive components, make sure to provide the "name" option

Sometimes after adding the import code, the component wouldn’t load, and then I’d make a nominal edit (e.g. adding a ? to the end of 'Components' in the import statement) and re-save, and the component would appear. But this didn’t work consistently. (Maybe this is an ES2015 or Vue bug?) My workaround for now was just creating aliases for each subdirectory in my components folder, which is working consistently, but not as clean a solution as your central components.js file.

If you have any thoughts about gotchas I might be missing, I’m all ears. In any case, thanks again for the tutorial.