Timo D
Timo D

Reputation: 1803

Linter warnings when importing packages within dart libs

I am working on a big Dart project that includes a web frontend as well as a couple of custom libs. We are using the recommended folder structure as described here.

my_app/
    lib/
        my_library1/
            example/
            lib/
                my_library1.dart
                my_library1.html
            pubspec.yaml
        ...
    web/
    pubspec.yaml

And we have several libraries in our lib folder that we all import in our main pubspec.yaml like this:

dependencies:
  my_library1:
    path: lib/my_library1

This is all working just fine, but when I use pub build to generate a JS build, I get a ton of Linter warnings about how to import packages correctly for each lib we have.

For example, the my_library1 lib has a polymer import in the my_library1.html file that looks like this:

<link rel="import" href="../../packages/polymer/polymer.html">

The warning for this would be:

[Warning from polymer (Linter) on my_app|lib/my_library1/lib/my_library1.html]:
line 1, column 1 of lib\my_library1\lib\my_library1.html: Invalid URL to reach to another package: ../../packages/polymer/polymer.html. Path reaching to other packages must first reach up all the way to the packages directory. For example, try changing the URL to: ../../../../packages/polymer/polymer.html. See http://goo.gl/5HPeuP#code_transformers_2 for details.
<link rel="import" href="../../packages/polymer/polymer.html">
^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^

Now, if I change that line to what they suggest (../../../../packages/polymer/polymer.html), I get this error instead:

[Warning from polymer (Linter) on my_library1|lib/my_library1.html]:
line 1, column 1 of lib\my_library1.html: Invalid URL to reach to another package: ../../../../packages/polymer/polymer.html. Path reaching to other packages must first reach up all the way to the packages directory. For example, try changing the URL to: ../../packages/polymer/polymer.html. See http://goo.gl/5HPeuP#code_transformers_2 for details.
<link rel="import" href="../../../../packages/polymer/polymer.html">
^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^

So no matter how I do it, it's wrong. Interestingly, the source file for the warning changes from my_library1|lib\my_library1.html to my_app|lib\my_library1\lib\my_library1.html.

Does this make sense to anyone?

btw, I have been reading up on this stuff on various Dart sites (#1, #2, #3), but to no avail.

I am using Dart 1.7.2 (STABLE) and polymer 0.15.3+2

Upvotes: 2

Views: 126

Answers (1)

luizmineo
luizmineo

Reputation: 966

Your package should not contain more than one pubspec.yaml file. The lib/ folder should have only dart files and other assets, such as html, js and css files. For example, you can organize your project as follow:

 my_app/
     lib/
        my_library1/
            my_library1.dart
            my_library1.html
        ...
     web/
     pubspec.yaml //you do not need to include my_library1 as a dependency here

Furthermore, if you want to use my_library1 in others packages, you need to move it to its own package:

 my_library1/
     example/
     lib/
         my_library1.dart
         my_library1.html
     pubspec.yaml
 my_app/
     lib/
         ...
     web/
     pubspec.yaml //you need to include my_library1 as a dependency here

In either case, my_library1.html can use the following import:

 <link rel="import" href="../../packages/polymer/polymer.html">

Upvotes: 2

Related Questions