Currently I import components from a package by a relative path:
<link rel="components" href="packages/packageA/components/login.html">
However when I start nesting packages this doesn't work properly anymore. I set up a small example which can be found here: https://github.com/nikgraf/nesting-components
When I try to build package app I get this error message:
error web/packages/packageA/components/login.html:6:5: exception while reading file "web/packages/packageA/components/packages/packageB/components/button.html", original message:
FileIOException: Cannot open file 'web/packages/packageA/components/packages/packageB/components/button.html' (OS Error: No such file or directory, errno = 2)
<link rel="components" href="packages/packageB/components/button.html">
^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^
warning web/packages/packageA/components/login.html:12:7: custom element with tag name button not found.
<div is="button"></div>
^^^^^^^^^^^^^^^^^
Current structure:
app - dependency: PackageA
PackageA - dependency: PackageB
Some Background information which might help: My application contains the x-login component from package A which is used by several Dart apps we build. The x-login component and in general package A contains specific code for our applications. x-login should able to use the x-button component which is in package B. Package B is a package with generic components we want to publish.
Do you have any advice on structuring my application differently or how to import components in a better way?
Having separate packages for your utility components and then domain specific components seems like a good idea.
What you can do is use the "package:packageA" style syntax when including the components without having to use relative paths.
<link rel="import" href="package:packageA/components/login.html">
As long as your pubspec knows where packageA is, you should be fine. This means when you change the path to the package dependancy to be either a git or pub url it will still work.