App Layout угловых компонентов с угловым дротиком выдает ошибку

AppLayout угловых компонентов в AngularDart выдает ошибку, я не могу распознать, чего не хватает в проекте для запуска. Пожалуйста, помогите мне объяснить, что требуется для простого запуска макета в проекте.

Serving angular_dart_app_layout web on http://localhost:8080
[BuilderTransformer: Instance of 'LibraryBuilder' on 
angular_dart_app_layout|primary]:
Error running TemplateGenerator for 
angular_dart_app_layout|lib/app_component.dart.
Error: FormatException: Illegal scheme character (at character 4)


app_component.csspackage:angular_components/src/components/app_layout/layou...
   ^

Stack Trace:
#0      _Uri._fail (dart:core/uri.dart:1597)
#1      _Uri._makeScheme (dart:core/uri.dart:2059)
#2      new _Uri.notSimple (dart:core/uri.dart:1437)
#3      Uri.parse (dart:core/uri.dart:1012)
#4      NgAssetReader._normalize 
(package:angular_compiler/src/asset.dart:29)
#5      NgAssetReader.resolveUrl (package:angular_compiler/src/asset.dart:23)
#6      DirectiveNormalizer.normalizeLoadedTemplate.<anonymous closure> (package:angular/src/compiler/directive_normalizer.dart:106)
#7      MappedListIterable.elementAt (dart:_internal/iterable.dart:413)
#8      ListIterable.toList (dart:_internal/iterable.dart:218)
#9      DirectiveNormalizer.normalizeLoadedTemplate (package:angular/src/compiler/directive_normalizer.dart:107)
#10     DirectiveNormalizer.normalizeTemplate.<anonymous closure> (package:angular/src/compiler/directive_normalizer.dart:75)
#11     _rootRunUnary (dart:async/zone.dart:1128)
#12     _CustomZone.runUnary (dart:async/zone.dart:1012)
#13     _FutureListener.handleValue (dart:async/future_impl.dart:129)
#14     _Future._propagateToListeners.handleValueCallback (dart:async/future_impl.dart:636)
#15     _Future._propagateToListeners (dart:async/future_impl.dart:665)
#16     _Future._completeWithValue (dart:async/future_impl.dart:478)
#17     _Future._asyncComplete.<anonymous closure> (dart:async/future_impl.dart:510)
#18     _rootRun (dart:async/zone.dart:1120)
#19     _CustomZone.run (dart:async/zone.dart:1001)
#20     _CustomZone.bindCallback.<anonymous closure> (dart:async/zone.dart:928)
#21     _microtaskLoop (dart:async/schedule_microtask.dart:41)
#22     _startMicrotaskLoop (dart:async/schedule_microtask.dart:50)
#23     _runPendingImmediateCallback (dart:isolate-patch/isolate_patch.dart:99)
#24     _RawReceivePortImpl._handleMessage (dart:isolate-patch/isolate_patch.dart:152)
Build completed with 1 errors.

app_component.dart

import 'package:angular/angular.dart';
import 'package:angular_components/angular_components.dart';
import 'src/todo_list/todo_list_component.dart';

@Component(
  selector: 'my-app',
  styleUrls: const [
     'app_component.css'
     'package:angular_components/src/components/app_layout/layout.scss.css',
  ],
  templateUrl: 'app_component.html',
  directives: const [
    materialDirectives,
    DeferredContentDirective,
    MaterialButtonComponent,
    MaterialIconComponent,
    MaterialTemporaryDrawerComponent,
    MaterialToggleComponent,
    TodoListComponent
  ],
  providers: const [materialProviders],
)
class AppComponent {
  bool end = false;
  bool overlay = false;
 }

app_component.html

<material-drawer temporary #drawer="drawer"
                 [attr.end]="end ? '' : null"
                 [attr.overlay]="overlay ? '' : null">
    <div *deferredContent>
        Here is some drawer content.
    </div>
</material-drawer>
<material-content>
    <header class="material-header shadow">
        <div class="material-header-row">
            <material-button class="material-drawer-button" icon (trigger)="drawer.toggle()">
                <material-icon icon="menu"></material-icon>
            </material-button>
            <span class="material-header-title">Mobile Layout</span>
            <div class="material-spacer"></div>
            <nav class="material-navigation">
                <a href="#AppLayout">Link 1</a>
            </nav>
            <nav class="material-navigation">
                <a href="#AppLayout">Link 2</a>
            </nav>
            <nav class="material-navigation">
                <a href="#AppLayout">Link 3</a>
            </nav>
        </div>
    </header>
    <div>
    <h1>My First AngularDart App</h1>

    <todo-list></todo-list>

    Lorem ipsum dolor sit amet, ad erat postea ullamcorper nec, veri veniam quo
    et. Diam phaedrum ei mea, quaeque voluptaria efficiantur duo no. Eu adhuc
    veritus civibus nec, sumo invidunt mel id, in vim dictas detraxit. Per an
    legere iriure blandit. Veri iisque accusamus an pri.
</div>
<div class="controls">
    <h3>Options</h3>

    <material-toggle [(checked)]="end" label="end">
    </material-toggle>

    <material-toggle [(checked)]="overlay" label="overlay">
    </material-toggle>
</div>

Источник

1 ответ

Решение

Пропущена запятая

 styleUrls: const [
     'app_component.css', // <<<=== added ,
     'package:angular_components/src/components/app_layout/layout.scss.css',
  ],

Дарт автоматически объединяет последовательные строки.

Есть правило Линтера, чтобы предотвратить эту ошибку

Если вы добавите

linter:
  rules:
    - no_adjacent_strings_in_list

в analysis_options.yaml в каталоге вашего проекта, анализатор предупредит вас. Также просто запуск dartformat обычно выявляет проблему.

Источник
Другие вопросы по тегам