angular - Angular 6 - 使用未找到的资产构建
问题描述
我正在尝试创建我的 Angular 项目的构建。我正在将 scss 与以下资产一起使用:
.ciao {
background-image: url("../../assets/images/bck--registration-company.png");
}
运行此代码:
ng build --prod --configuration=coll --base-href ./
我在 dist 文件夹中,在 index.html 的同一目录中,文件“bck--registration-company.png”和“assets”文件夹里面还有另一个“bck--registration-company.png”。我想使用资产文件夹中的资源。
我尝试更改基本 href、相对和绝对图像路径,但没有。例子:
.background--image-carousel2{
background-image: url("/assets/images/carousel2.jpg");
}
使用此路径,请求 URL)为:
Request URL: http://localhost:63342/assets/images/carousel2.jpg
这是错误的,因为它可能是:
http://localhost:63342/project/dist/name_project/assets/images/bck--registration-company.png
在我的 angular.json 中:
"architect": {
"build": {
"builder": "@angular-devkit/build-angular:browser",
"options": {
"outputPath": "dist/name_project",
"index": "src/index.html",
"main": "src/main.ts",
"polyfills": "src/polyfills.ts",
"tsConfig": "src/tsconfig.app.json",
"assets": [
"src/assets"
],
"styles": [
"src/styles.scss"
],
"scripts": [
]
},
我该如何解决这个问题?谢谢你。
解决方案
试试这个方法
Angular 能够直接访问资产文件夹。
.ciao {
background-image: url("assets/images/bck--registration-company.png");
}
然后进行构建
ng build --prod
然后将整个系统路径放在 dist/index.html 文件中
在基本 url 中设置项目文件夹的整个路径。
推荐阅读
- django - 将模板的一部分重构为自己的文件会破坏 django
- javascript - Discord.js v12 尼克命令
- docker - 每个队列消费者进程是否需要自己的 Docker 映像?
- c++ - E0028:表达式必须有一个常量值,在类 NodeList
- scala - Spark-Scala-Intellij java.lang.NoSuchMethodError
- reactjs - 如何在 facebook 分享中删除授权文本
- html - 联系表格 7“选择”字段的样式与其他字段不同
- python - 从一维张量收集的 pytorch
- grep - grep 从一组可能的值中搜索字符串中的一个字符
- junit - 修复消息“JunitAssertions 类型的方法 empty() 未定义”