Comment obtenir vers le répertoire public
- Je utiliser angulaires-cli dans mon projet, et je veux utiliser une image globale - mon site à l'image du logo.
Que je comprends de la public
répertoire à la racine du projet (qui angular-cli
créé) pour les biens publics - ce qui semble être un bon endroit pour mettre mon image (corrigez-moi si je me trompe).
Mais, quand j'ai essayer de faire cette image dans mon <img src="/public/book4u-logo.svg" />
tag, je reçois 404. La raison en est, bien sûr, ma racine du projet est la src
répertoire et non pas le répertoire racine du projet.
Alors, comment dois-je arriver à ce répertoire? Ou dois-je placer mon image dans un autre répertoire?
Mon arborescence du projet (j'ai supprimer l'inutile suff):
.
├── angular-cli-build.js
├── angular-cli.json
├── package.json
├── public
│ ├── book4u-logo.svg
│ └── hero-image-default.jpg
├── src
│ ├── app
│ │ ├── bfy.component.html
│ │ ├── bfy.component.scss
│ │ ├── bfy.component.ts
│ │ ├── environment.ts
│ ├── favicon.ico
│ ├── index.html
│ ├── main.ts
│ ├── system-config.ts
│ ├── tsconfig.json
│ └── typings.d.ts
├── tslint.json
└── typings.json
La img
balise est à /src/app/bfy.component.html
et l'image elle-même est à /public/book4u-logo.svg
.
src/shared/assets/img/
fait sens pour moi.Il doit être juste
<img src="/book4u-logo.svg" />
.. Tout en public/
est copié à dist/
"qui est le dossier racine pour votre application..OriginalL'auteur Nir | 2016-06-19
Vous devez vous connecter pour publier un commentaire.
La
Angular-cli
place tous les fichiers dans le/dist
répertoire.Pour afficher l'image dans index.html:
<img src="book4u-logo.svg" />
Si vous souhaitez utiliser votre image dans votre application, vous devez utiliser un dossier dans le
/src
répertoire commesrc/shared/assets/img/book4u-logo.svg
Le dossier public est pour des biens publics et le contenu est copié dans le
/dist
dossier.Cependant, lors de l'exécution de
ng build --prod
le javascript dans le/public
dossier n'est pas copié sur/dist
.Il y a un sujet ouvert sur Github:Statique de la JS actif qui n'est pas de la copie
L'image placée dans le dossier public doit être accessible à partir de la
dist
dossier.OriginalL'auteur KB_
Dernière version angulaire-cli(
angular-cli: 1.0.0-beta.19-3
) fournit un dossier des actifs sous répertoire src. Vous avez juste besoin d'ajouter la propriété src d'une balise d'image comme ci-dessous,<img src="./assets/logo.png">
Remarque: Lorsque vous générez le projet à l'aide de
ng serve
il faudra copier votreassets
dossier dedist
dossier.OriginalL'auteur Suchin
J'ai résolu un problème similaire dans Angulaire 4 (j'ai eu un fichier css qui est dans le dossier public et je l'ai mis dans le dossier des actifs).
La réponse serait:
<img src="./assets/book4u-logo.svg>
OriginalL'auteur Joey Sobrinos