在 Angular 12 中,绝对路径的使用方式发生了变化,因此在针对 templateUrl 和 styleUrls 的相对路径进行编程时可能会遇到问题。下面是一个示例组件,它通过相对路径引用了一个样式表文件:
@Component({ selector: 'app-example', templateUrl: './example.component.html', styleUrls: ['./example.component.css'] })
在 Angular 12 中,使用相对路径仍然可以工作,但使用绝对路径将会出现问题。幸运的是,解决这个问题的方法很简单。你可以使用 @angular-devkit/core 库中的 join 函数来编写重定向路径。它将帮助你创建正确的绝对路径,从而消除了问题。
首先,在组件中引入 join 函数:
import { join } from 'path';
然后,用它来替换原来的相对路径:
@Component({ selector: 'app-example', templateUrl: join(__dirname, 'example.component.html'), styleUrls: [join(__dirname, 'example.component.css')] })
这样就可以在 Angular 12 中使用绝对路径了。