css - 如何正确导入导入其他 CSS/SCSS 的 SCSS

标签 css angular sass

我在一个 Angular 元素中有一个 SCSS,它从 node_modules 导入另一个 SCSS:

@import "node_modules/grapesjs/src/styles/scss/main.scss";

SCSS导入其他样式:

@import "node_modules/spectrum-colorpicker/spectrum";
@import "node_modules/font-awesome/scss/font-awesome";
@import "node_modules/codemirror/lib/codemirror";
@import "node_modules/codemirror/theme/hopscotch";


@import "gjs_variables.scss";

但这会导致这个错误:

Cant find stylesheet to import.

我猜这意味着我需要正确指定路径。我的 angular.json 中有这个:

        "stylePreprocessorOptions": {
          "includePaths": [
            "src/styles",
            "."    // **this is where the node_modules directory is**
          ]
        },

我的猜测是 main.scss 中的路径是相对于该文件的。我不知道如何指定。

最佳答案

你是对的,它放在 angular.json 文件的 styles 属性中。

此外,扩展无关紧要,编译器无论如何都会将其转换为 JS(除非它是一种 Assets ,否则它会保持原样)

路径是

./node_modules/...

关于css - 如何正确导入导入其他 CSS/SCSS 的 SCSS,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/58063357/

相关文章:

javascript - 使用搜索栏在列中过滤具有重复条目的区分大小写的数据并返回该特定行 AngularJS

html - IE 和 Firefox 忽略最大宽度样式

javascript - 如何用汉堡包按钮替换固定顶部导航?

html - Font Awesome Icons,如何添加悬停效果?

angular - "@angular/compiler-cli"软件包未正确安装

angular - 如何将登录表单发布到遗留服务器(没有 Ajax)?

angular - Angular Elements 和 Stencil 的技术概念

css - 在 Sass 中重复单个声明的最佳方法是什么?

node.js - NextJS 组件级 SASS 样式

ruby-on-rails - SASS:从样式表中的另一个目录导入 bourbon lib