angular image url找不到问题

本文详细介绍了在Angular项目中如何正确配置资源文件路径,包括在angular.json中添加资源文件配置,index.html中设置base href,以及在组件和样式文件中使用相对路径的方法。特别关注了LESS文件中URL路径的特殊处理方式。

摘要生成于 C知道 ,由 DeepSeek-R1 满血版支持, 前往体验 >

1、首先添加资源文件配置,angular.json --> options -->  assets 添加: "src/assets"

2、index.html里: <base href="/">

2、ts/html中 url要写相对路径: assent/image/a.png (前边 "./" 可以不写)

3、less里这样写 background:~'url("../../assent/image/a.png")'   

说明:

  • 如果less中:“background-image: url('assets/event-bg.png');”  会报CssSyntaxError。
  • 如果: “ackground-image: url('../../../assets/event-bg.png');”  会报not found。

 less中 "~"符号,表示编译时不计算。

  • 例如less中这样写: width:~'calc(300px-30px)';, 编译成css后是:width: calc(300px-30px);
  • 例如less中这样写: width:calc(300px-30px);, 编译成css后是:width: calc(270px);
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值