我正在重构Angular应用程序,当我将组件移动到新的目录位置时,我发现在组件的SCSS文件中处理@import
条路径变得有点乏味.
例如,假设我的应用程序根目录中有文件src/_mixins.scss
,组件src/app/my-widget/my-widget.component.scss
像so @import '../../mixins';
一样导入SCS.一切都很好.
但是后来我决定my-widget.component
实际上是另一个组件my-thingy.component
下的"共享组件",所以我在src/app/my-thingy
下创建了一个shared
文件夹,并将src/app/my-widget
中的所有内容都移动到其中.
我hope你还和我在一起.所以,现在我有src/app/my-thingy/shared/my-widget
个,我修改了我的SCSS文件以导入@import '../../../../mixins'
.
Note:这是一个简化的例子.有些路径变得相对较深(没有双关语…or was it?),所有这些.
和/
都有点多.
TL;DR个
如果从一开始我就可以在所有组件的SCSS文件中导入相对于根目录的_mixins.scss
条路径,这样我就不必在重构时不断弄乱@import
条路径,那么这将是super-handy条.(例如,类似于@import '~/mixins'
的东西).Does something like this exist?
我try 过的(遗憾的是,失败了):
-
@import '~/mixins'; /** I had real hope for this one **/
个 @import 'mixins'; /** Just being overly optimistic here **/
@import '~//mixins'; /** Now I'm just making stuff up **/
I understand that I'm already going to have to modify my mod files to point to the new path of the component with all of this "moving stuff around", but... hey, one less thing, right?