英文:
Resolving a library projects SASS files from an application in the same workspace?
问题
能否通过一种类似于从同一工作区的应用程序中解析ts
文件的方法来解析工作区库中包含的SASS?为了提供上下文,我将如下设置一个真实的工作区:
ng new theme-workspace --create-application=false
cd theme-workspace
ng g library theme
mkdir projects/theme/src/lib/styles
touch projects/theme/src/lib/styles/index.scss
ng g application playground
在projects/theme/src/lib/styles
目录中,我们将在index.scss
中添加以下内容:
$color: red;
为了包含样式资源,我们需要更新ng-package.json
,添加一个类似于以下的asset
块:
"assets": [
{ "input": "src/lib/styles", "glob": "**/*.scss", "output": "styles" }
]
如果我们像这样构建这个项目库:
ng build theme
我们会发现dist/theme/styles
包含index.scss
。
我们可以从playground中像这样访问生成的ts
组件ThemeComponent
:
import { ThemeComponent } from 'theme';
当使用@use
来导入SASS的index.scss
模块时,是否可以使用类似的命名空间?
例如,如果我们在playground中尝试这样做,styles.scss
模块会失败:
@use 'theme/styles' as t;
这是错误信息:
SassError: 无法找到要导入的样式表。
╷
2 │ @use 'theme/styles' as t;
现在,我们可以通过使用相对文件导入来解决这个问题,但我想知道是否有一种使用库名称空间的“快捷”方法?
英文:
Is it possible to resolve SASS contained in a workspace library using an approach that is similar to resolving ts
files from an application within the same workspace? For context I'll setup a real workspace as follows:
ng new theme-workspace --create-application=false
cd theme-workspace
ng g library theme
mkdir projects/theme/src/lib/styles
touch projects/theme/src/lib/styles/index.scss
ng g application playground
Within the directory projects/theme/src/lib/styles
we will add the following content to index.scss
.
$color: red;
And in order to include the style assets we need to update ng-package.json
with an asset
block like this:
"assets": [
{ "input": "src/lib/styles", "glob": "**/*.scss", "output": "styles" }
]
If we build this project library like this:
ng build theme
We see that dist/theme/styles
contains index.scss
.
We can access the generated ts
component ThemeComponent
like this from the playground.
import { ThemeComponent } from 'theme';
When using @use
to import the SASS index.scss
module is it possible to use a similar namespace?
For example if we try this from the playground styles.scss
module it fails:
@use `theme/styles` as t;
This is the error.
SassError: Can't find stylesheet to import.
╷
2 │ @use 'theme/styles' as t;
Now we could resolve by using a relative file import, but I'm curious whether there's a "Shorthand" way of doing it that uses the library name space?
答案1
得分: 0
目前不支持此功能,但有一个功能请求。
英文:
Currently this is not supported, but there is a feature request for it.
通过集体智慧和协作来改善编程学习和解决问题的方式。致力于成为全球开发者共同参与的知识库,让每个人都能够通过互相帮助和分享经验来进步。
评论