【发布时间】：2019-11-06 05:38:42
【问题描述】：
我正在尝试在一个全新的 Angular (8.0.3) 项目中使用（图像）资产。 我从文档中查看了asset configuration。从那里的信息来看，它应该开箱即用？
所以我创建了一个图片文件夹，并在其中放了一张随机的 .jpg 图片。
ls src/assets/images
paladin.jpg
ls src
app assets environments favicon.ico index.html main.ts polyfills.ts styles.css test.ts
angular.json （这都是默认的）
"assets": [
"src/assets",
"src/favicon.ico"
],
"styles": [
"src/styles.css"
],
"scripts": []
在 index.html 我们有 （也是默认的）
<link rel="icon" type="image/x-icon" href="favicon.ico">
app.component.html （我用资产图片更改了base64 logo）
<img width="300" alt="Angular Logo" src="assets/images/paladin.jpg">
但是没有加载或复制到“dist”目录。
我最接近答案的是旧线程：
ng serve
ng build
同样的结果...甚至 favicon.ico 没有加载...
我试过了：
<img width="300" alt="Angular Logo" src="./assets/images/paladin.jpg">
<img width="300" alt="Angular Logo" src="assets/images/paladin.jpg">
<img width="300" alt="Angular Logo" src="../assets/images/paladin.jpg">
<img width="300" alt="Angular Logo" [src]="assets/images/paladin.jpg">
<img width="300" alt="Angular Logo" [src]="'assets/images/paladin.jpg'">
如何重现
ng new myTestApp
# => routing y/N doesn't matter
# => css option
ng serve --open
=> favicon 给出 404
我在这里遗漏了一些明显的东西吗？ :)
更多可能有帮助的信息：
$ ng version
_ _ ____ _ ___
/ \ _ __ __ _ _ _| | __ _ _ __ / ___| | |_ _|
/ △ \ | '_ \ / _` | | | | |/ _` | '__| | | | | | |
/ ___ \| | | | (_| | |_| | | (_| | | | |___| |___ | |
/_/ \_\_| |_|\__, |\__,_|_|\__,_|_| \____|_____|___|
|___/
Angular CLI: 8.0.3
Node: 10.16.0
OS: win32 x64
Angular: 8.0.2
... animations, common, compiler, compiler-cli, core, forms
... language-service, platform-browser, platform-browser-dynamic
... router
Package Version
-----------------------------------------------------------
@angular-devkit/architect 0.800.3
@angular-devkit/build-angular 0.800.3
@angular-devkit/build-optimizer 0.800.3
@angular-devkit/build-webpack 0.800.3
@angular-devkit/core 8.0.3
@angular-devkit/schematics 8.0.3
@angular/cli 8.0.3
@ngtools/webpack 8.0.3
@schematics/angular 8.0.3
@schematics/update 0.800.3
rxjs 6.4.0
typescript 3.4.5
webpack 4.30.0
$ npm list -g --depth=0
C:\Users\jonghena\AppData\Roaming\npm
`-- @angular/cli@8.0.3
$ npm list --depth=0
my-test-app@0.0.0 D:\Gitprojects (GitHub)\angular-test\myTestApp
+-- @angular-devkit/build-angular@0.800.3
+-- @angular/animations@8.0.2
+-- @angular/cli@8.0.3
+-- @angular/common@8.0.2
+-- @angular/compiler@8.0.2
+-- @angular/compiler-cli@8.0.2
+-- @angular/core@8.0.2
+-- @angular/forms@8.0.2
+-- @angular/language-service@8.0.2
+-- @angular/platform-browser@8.0.2
+-- @angular/platform-browser-dynamic@8.0.2
+-- @angular/router@8.0.2
+-- @types/jasmine@3.3.13
+-- @types/jasminewd2@2.0.6
+-- @types/node@8.9.5
+-- codelyzer@5.1.0
+-- jasmine-core@3.4.0
+-- jasmine-spec-reporter@4.2.1
+-- karma@4.1.0
+-- karma-chrome-launcher@2.2.0
+-- karma-coverage-istanbul-reporter@2.0.5
+-- karma-jasmine@2.0.1
+-- karma-jasmine-html-reporter@1.4.2
+-- protractor@5.4.2
+-- rxjs@6.4.0
+-- ts-node@7.0.1
+-- tslib@1.10.0
+-- tslint@5.15.0
+-- typescript@3.4.5
`-- zone.js@0.9.1
完整的 angular.json：https://pastebin.com/HaeKmQZ0
【问题讨论】：
-
src="/assets/images/paladin.jpg"应该可以工作 -
很遗憾没有，我又试了一次。但是，开箱即用，favicon.ico 给出 404，我什至没有更改任何代码，这是否正常？
-
不，不是。创建应用程序后，您可以通过
http://localhost:4200/favicon.ico访问网站图标，并访问如下图像：<img src="assets/images/paladin.jpg" />。您是否更改了一些 Angular 配置？ -
那么，在你执行 'ng build --prod' 之后，然后查看 dist 文件夹，你看不到 assets 文件夹吗？
-
@Mathias my full angular.json: pastebin.com/HaeKmQZ0 就像我说我没碰过它，但我现在确实看到有 2 个部分，两者都是一样的。
标签： angular