zero_coding zero_coding - 27 days ago 7
Dart Question

How to organize assets?

I wrote a component that contains an image. The file structure looks like: enter image description here

My question is, it is right choise to put assets folder into web folder?

UPDATE

I tried as follow:

import 'package:angular2/core.dart';
import 'package:angular2_components/angular2_components.dart';
import 'package:wp_login/models/Login.dart';
import 'package:wp_login/assets/scale.svg';

@Component(
selector: 'start-app',
directives: const[MaterialInputComponent],
styleUrls: const ['login_component.css'],
templateUrl: 'login_component.html')
class AppComponent {

String scaleImg = 'scale.svg';
Login login;


onSubmit() {
print('Submit');
}

}


And the file structure:

enter image description here

But it does not work at all.

Answer

I'd suggest to put everything into lib, actually lib/asset, if it's reused in several places, or lib/login_component, together with the component files if they belong together.

Referencing files in web from files in lib/** is bad practice.

I also suggest not putting anything into web that doesn't need to be there. References to lib work the same from everywhere (from web, lib, test, ..., but references to web only work from within web.

Refer to files in lib always using

packages/my_package/file_or_dir.xxx

(note the missing lib)

From files within lib also relative paths like are fine

../file_or_dir.xxx 

or just

file_or_dir.xxx