如何解决IIS中的Angular 10 --deploy-url资产路径
从版本7升级到 Angular 10 后,资产文件夹的字体和图像未加载到浏览器中并出现404错误。
http://localhost/assets/fonts/Regular/OpenSans-Regular.woff?v=1.1.0 net::ERR_ABORTED 404 (Not Found)
我将我的角度应用程序托管在 IIS 中的子目录中,并使用--deploy-url
和--base-href
开关来构建我的应用程序。
我的构建命令:
ng build --prod --base-href /MyApp/ --deploy-url /MyApp/Scripts/
Scripts文件夹包含所有build命令输出。 我将组件内部的图像引用为:
background-image: url(/assets/images/login_bg.png);
,并将Fonts引用为:
@font-face {
font-family: 'Open Sans';
src: url('/assets/fonts/Regular/OpenSans-Regular.eot?v=1.1.0');
src: url('/assets/fonts/Regular/OpenSans-Regular.eot?#iefix&v=1.1.0') format('embedded-opentype'),url('/assets/fonts/Regular/OpenSans-Regular.woff?v=1.1.0') format('woff'),url('/assets/fonts/Regular/OpenSans-Regular.ttf?v=1.1.0') format('truetype'),url('/assets/fonts/Regular/OpenSans-Regular.svg?v=1.1.0#Regular') format('svg');
font-weight: normal;
font-style: normal;
}
我注意到在角度CLI 7和角度CLI 10中,构建输出是不同的。 在这里我们可以看到,使用 Angular 7 ,我们具有在Web服务器中定位图像的正确路径,但是在 Angular 10 中,我们仅具有导致404错误的部分路径。>
请提出建议。
解决方法
在github中记录了相同的问题
基本上,推荐的解决方案是使用从组件文件夹到根级别../
文件夹的相对路径assets
。
版权声明:本文内容由互联网用户自发贡献,该文观点与技术仅代表作者本人。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如发现本站有涉嫌侵权/违法违规的内容, 请发送邮件至 dio@foxmail.com 举报,一经查实,本站将立刻删除。