SassError:应为")“
SassError:应为")"
这个错误是由于在Sass代码中缺少了一个闭合的括号")"导致的。Sass是一种CSS预处理器，它允许开发者使用类似于编程语言的方式来编写CSS代码，提供了更多的功能和灵活性。
在Sass中，括号的使用非常重要，它们用于表示代码块的开始和结束。在这个错误中，编译器检测到一个缺少闭合括号的情况，导致无法正确解析代码。
要解决这个错误，你需要仔细检查你的Sass代码，找到缺少闭合括号的位置，并添加正确的括号来修复问题。通常情况下，编译器会给出具体的错误行数和位置，以帮助你快速定位问题。
以下是一些常见的导致这个错误的情况：
- 缺少闭合括号：在Sass代码中，每个左括号"("都需要有一个对应的右括号")"来闭合。如果你忘记了添加闭合括号，就会导致这个错误。
- 括号不匹配：有时候，你可能会不小心添加了多余的括号或者括号不匹配，比如多了一个")"或者少了一个")"。这也会导致编译器无法正确解析代码。
- 嵌套错误：如果你在Sass代码中使用了嵌套结构，比如在一个选择器内部定义了另一个选择器，那么你需要确保每个嵌套层级都有正确的闭合括号。
总之，要解决这个错误，你需要仔细检查你的Sass代码，确保每个括号都有正确的闭合，并且没有多余或者缺少括号的情况。如果你对Sass语法不熟悉，可以参考Sass官方文档或者其他相关教程来学习更多关于Sass的知识。
腾讯云相关产品和产品介绍链接地址：
- 腾讯云Sass产品介绍：https://cloud.tencent.com/product/sass
相关·内容
我刚刚开始了一个新的Vue项目，但是当我添加一个组件(datatable，carousel)时，我得到了以下错误：“
此错误用于添加V-DATABLE
Syntax Error: SassError: Expected identifier.
╷
68 │ position: relative
│ ^
╵
node_modules\vuetify\src\components\VSelect\VSelect.sass 68:25 root stylesheet
此错误用于添加V-C
浏览 17提问于2021-04-18得票数 5
Sass-加载程序似乎不使用在类型记录配置中声明的路径(别名)。因此，简单的“使用”或“导入”就会给出一个未找到的错误。
Webpack
resolve: {
plugins: [new TsconfigPathsPlugin()],
tsconfig
"paths": {
"Components/*": ["src/components/*"],
结果
SassError: SassError: Can't find stylesheet to import.
1 │ @use 'Components/UI/Gr
浏览 1提问于2021-11-02得票数 5
我已经在下一个js和bootstrap中安装了sass，我现在可以访问bootstrap变量并重新指定变量的值，但是当我试图从bootstrap扩展实用程序类时，它给我错误： SassError: The target selector was not found.
Use "@extend .text-center !optional" to avoid this error.
╷
9 │ @extend .text-center; //!optional;
│ ^^^^^^^^^^^^^^^^^^^^
╵
styles\Step0.m
浏览 95提问于2021-11-03得票数 0
我对使用sass很陌生，而且我在中使用混音器有一些困难
我链接的页面描述了如何使用density($density-scale)混音，但我似乎不知道如何使用它。指南展示了如何为mdc-button使用mixin的示例，因此我尝试对mdc-icon-button执行相同的操作。以下是我试过的一些东西。
@use "@material/icon-button/mdc-icon-button";
@use "@material/icon-button";
// ^ The line above results in this error: SassError: Can
浏览 7提问于2020-02-24得票数 1
回答已采纳
我无法将styles.scss文件从角通知程序导入到我的项目中。
以下是我的错误：
Module build failed (from ./node_modules/sass-loader/dist/cjs.js): SassError:
Can't find stylesheet to import. ╷ 10 │ @import" ~/angular-notifier/styles.scss"; │ ^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^ ╵ src/styles.scss 10:8 root stylesheet
ERROR in .
浏览 18提问于2022-03-07得票数 2
我正在尝试使用故事簿来处理我的组件。我的组件使用SASS进行样式设计，但是当我开始编写故事书时，我会得到以下错误：
SassError: SassError: expected "{".
╷
2 │ var content = require("!!../../../node_modules/css-loader/dist/cjs.js?modules&importLoaders!../../../node_modules/sass-loader/dist/cjs.js!./fileUpload.scss");
│
浏览 6提问于2021-12-31得票数 5
我将Angular从7更新到了9，并得到了这个错误： ERROR in ./src/styles.scss (./node_modules/@angular-devkit/build-angular/src/angular-cli-files/plugins/raw-css-loader.js!./node_modules/postcss-loader/src??embedded!./node_modules/sass-loader/dist/cjs.js??ref--13-3!./src/styles.scss)
Module build failed (from ./node_modul
浏览 141提问于2020-04-16得票数 0
我有两个外部的，我想使用在我的Nativescript-Vue文件。
它们位于以下目录/app/styles/_variables.sccs和/app/styles/generalStyles.scss中。
我用_variables.sccs导入generalStyles.sccs。
但是，当我想在Vue文件中导入generalStyles.sccs时，它会给出以下错误：
SassError:导入未找到或不可读的文件:SassError/generalStyles。在app/components/Select/StationSelect.vue的第277行
@导入“样式/通用样式”；
Sta
浏览 6提问于2020-01-18得票数 0
尝试将"sass:colors“导入到我的colors.scss样式表时，我得到了SassError："@use规则必须在任何其他规则之前编写”，尽管它是我文件的第一行。我怀疑在某种Sass编译之后，Vue正在处理这行代码。
在我的根目录中是我的vue.config.js
module.exports = {
...
css: {
loaderOptions: {
scss: {
prependData: `
@import "~@/styles/colors.scss";
@i
浏览 1提问于2020-08-19得票数 9
我试图为我的项目创建一个全局可访问的颜色主文件，但一直收到SassError: Invalid CSS after... expected expression错误。我的文件结构如下： |src
|components
| |Skillset
| |Skillset.js
| |Skillset.module.scss
|_colors.scss 在我的_colors.scss文件中，$darkPurple: #3B3B4F;位于顶部。 在我的Skillset.module
浏览 45提问于2020-08-23得票数 1
1回答
如何使用CDN中的sass变量
、、、、
我有一个使用create-react-app的项目和一个远程托管的colors.scss文件，其中只有颜色的定义(下面的内容)。
$color-blue: #2281ff;
$color-cyan: #11a0f2;
$color-lue-light: #cfd7fc;
接下来，我有一个index.scss，它看起来如下所示：
@import url('http://url.domain/colors.scss');
body: {
background-color: $color-blue;
}
在构建应用程序时，我会得到以下错误
SassError: Undefine
浏览 5提问于2021-12-30得票数 0
1回答
在CSS中，我们使用\对选择器中的字符进行转义，如下所示： .width-1\.5 { width: 1.5rem; }
.width-1\/2 { width: 50%; } 因此，这允许我们拥有像这样的CSS类：class="width-1/2" 我们将所有这些值存储在Sass映射中，如下所示： $widths: (1\.5: 1.5rem, 1\/2: 50%); 然后我们用一个简单的循环创建CSS： @each $key,
$value in $widths {
.width-#{$key}: $value
} 然而，我们得到了错误：SassError: 1\
浏览 13提问于2021-02-05得票数 0
1回答
主题选择:自定义
错误: SassError：@use规则必须在任何其他规则之前编写。
╷39│@使用“角质/材料”作为垫子；
╵src\定制主题.src 39:1根样式表
浏览 3提问于2022-08-01得票数 -2
我试图将scss文件从资产导入到组件，得到的错误显示，
@import "@/assets/scss/\_globvar.scss";
这是我要犯的错误
“模块构建失败(来自./node_sass/sass-加载程序/dist/cjs.js)：SassError:无法找到导入"”的样式表
文件结构
浏览 14提问于2022-05-06得票数 1
在从webpacker 4升级到5.3.4版本后，我看到以下错误。
Module build failed (from ./node_modules/sass-loader/dist/cjs.js):
SassError: Can't find stylesheet to import.
╷
1 │ @import "stylesheet/actiontext.scss"
我该怎么解决这个问题？
浏览 3提问于2022-02-16得票数 1
回答已采纳
我在组件中导入了几个.scss文件，这些文件包含在模块中。当我为dev或prod构建我的项目时，一切都很好，但是当我运行ng test时，我会看到一些错误，比如：
SassError: SassError: Can't find stylesheet to import.
1 │ @import "mixins";
在我的模块中，每个导入的.scss文件都会发生这种情况。共享样式放在src/assets/styles目录中，如下所示：
-src
-assets
-styles
-_mixins.scss
-_theme.scss
浏览 1提问于2020-08-06得票数 8
1回答
我正在使用quasar框架，在编译项目时，我得到了上面的错误 Module build failed (from ./node_modules/sass-loader/dist/cjs.js):
SassError: This file is already being loaded.
╷
1 │ @import '~src/css/quasar.variables.scss', 'quasar/src/css/variables.sass';
│ ^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^
╵
src\c
浏览 1069提问于2021-07-23得票数 0
1回答
我正在尝试获得一个NX12工作区，运行一些我正在创作的角度组件的故事书。
当我试图包含全局scss文件时，我面临一个问题，我一直收到以下错误。
SassError: SassError: expected "{".
╷
2 │ import API from "!../../../../../../node_modules/style-loader/dist/runtime/injectStylesIntoStyleTag.js";
│
浏览 2提问于2018-03-19得票数 3
1回答
我正在尝试为节点模块使用sass加载程序。但是，无论我尝试什么，都会发生以下错误：
SassError:找不到要导入的样式表。
我的vue.config.js看起来是这样的：
module.exports = {
css: {
sourceMap: true,
loaderOptions: {
scss: {
prependData: `
@import "~@/my-node-module/theme/engine.scss";
`
浏览 1提问于2020-04-21得票数 2
回答已采纳
我对SCSS非常陌生……我在一个mixins SCSS文件中创建了一个函数，当我运行gatsby develop时，我得到了一个未定义变量的变量，尽管“SassError”是一个参数： Webpack SassError 对如何解决这个问题有什么建议吗？下面是_mixins.scss中使用的代码开头的结构： @use './units';
// Add transitions to attributes
@mixin transition($attrs, $speed: normal) {
$res: "";
// Multiple attribu
浏览 41提问于2021-09-03得票数 0
我尝试使用webpack添加vuetify，但得到了SassError: Expected 18:25:32 webpacker1|模块构建失败(来自./node_modules/sass-loader/dist/cjs.js)： 18:25:32 webpacker.1 | SassError:预期换行符。 18:25:32 webpacker.1 |╷ 18:25:32 webpacker.1 |1│var api =webpacker.1 验证插件： import Vue from 'vue'
import Vuetify from 'vuetify/lib&#
浏览 12提问于2020-04-04得票数 1
我有一个9角应用程序，当我使用这个代码片段SCSS时，它返回这个错误：
SassError: Invalid parent selector "*"
╷
52 │ &#{$value} {
│ ^^^^^^^^^^^^^^^
╵
这是一个片段：
$values: (
"":"",
one: one,
two: two,
);
@mixin gen() {
@each $value, $key in $values {
@media (min-width: 300p
浏览 0提问于2020-02-14得票数 0
回答已采纳
我使用的是角和scss，但是当我试图导入一个变量时，我得到了以下错误：
SassError: Undefined variable. border: $color-red 2px solid;
但是我在我的文件中定义了这个变量：
我用这个方法：
我尝试过这样设置路径：@import url("./global/_colors.scss");，带有下划线，但它不起作用。
有什么问题吗？
浏览 5提问于2021-04-18得票数 0
为了准备Dart Sass 2.0.0，我按照以下说明迁移了我的scss文件中的当前分区，从斜杠迁移到函数"divide"：
迁移运行良好，因为我不再收到有关使用斜杠的警告。
当我在那之后运行npm run dev时，问题就出现了，并给出了以下错误：SassError: Undefinied operation "divide"
我应该升级其他东西，这样npm就不会抱怨“分割”功能了吗？
浏览 142提问于2021-05-21得票数 1
1回答
我跟随尝试在Vue 2.6.x“sass”中使用@："^1.32.11"，“sass-加载程序”："^10.1.0"，并且在尝试将sass文件导入Vue组件时总是会出错。
Module build failed (from ./node_modules/sass-loader/dist/cjs.js): frie
浏览 1提问于2021-04-28得票数 1
1回答
如何在SASS文件中使用CSS变量？我试过：
:root
--app: red
或
$color
:root
--app: #{$color}
我希望结果呈现如下：
:root {
--app: red
}
但是它不起作用，我得到了SassError:无效CSS，期望有一个选择器或规则，是"root：{"。
如何在SASS文件中选择这个：根？
固定了i卸载节点-sass和安装了sass，并且它可以工作。( Ty帮助:)
浏览 4提问于2020-04-04得票数 1
回答已采纳
我试图在LoginPage组件样式期间使用CSS变量，但收到以下错误：SassError: Undefined variable: "$main-background-color".此错误出现在_styles.scss文件中。
这是我的项目结构：
我将_variables.scss和styles.scss都导入到主index.scss文件中：
在导入变量时，我做错了什么？为什么我不能在_styles.scss文件中使用它们？
浏览 2提问于2020-02-23得票数 4
回答已采纳
基本的想法是在一个地方定义我的媒体查询。我现在的尝试是这样的： $mobile: "@media (max-width: 600px):not(#app.force-desktop)";
#{$mobile} {
...
} 但是，这会导致错误:仅将$mobile设置为(例如) SassError: Invalid CSS after "@": expected selector, was "@media (max-width: " :not(#app.force-desktop)似乎可以正确编译。 也许有一种不同的方法来解决这个问题，
浏览 26提问于2020-10-27得票数 2
回答已采纳
1回答
我不能使用媒体查询标题作为插值。当像下面这样使用它时，它会给出一个错误
$token-screen-md: "@media only screen and (min-width: 48rem)";
#{$token-screen-md} {
display: table-row;
min-width: 100%;
}
有人能帮我解决这个问题吗？
模块构建失败(来自./node_sass/sass-加载程序/dist/cjs.js)：SassError:预期选择器。@media只显示屏幕和(最小宽度:48 from){
浏览 1提问于2022-04-13得票数 0
回答已采纳
我正在尝试使用一个名为$green的Saas var
$green: 60, 187, 180; // 60, 187, 180 are my values in rgb
稍后，我尝试将此颜色包含在background-color属性中：
.icon-button[aria-label="thumbs up"] {
background-color: rgba($green, 0.8);
}
.icon-button[aria-label="thumbs up"]:hover {
background-color: rgba($green, 1);
浏览 0提问于2021-07-20得票数 0
回答已采纳
1回答
如果你尝试只安装Nebular Auth Module，你可能会遇到下面这个错误。
Error: ./src/styles.scss
Module build failed (from ./node_modules/mini-css-extract-plugin/dist/loader.js):
ModuleBuildError: Module build failed (from ./node_modules/sass-loader/dist/cjs.js):
SassError: Undefined mixin.
╷
5 │ ┌ @include nb-install() {
6 │
浏览 0提问于2020-12-28得票数 0
在一个带有尾风的项目中，我需要使tailwind.config.js中定义的颜色(直接在scss文件中)变暗。
@debug "Darken Color: #{darken(theme("colors.gray.500"), 10%)}";
这会导致错误：
SassError: $color: theme("colors.gray.500") is not a color.
然而，当我使用表示法“主题(”works s.gray.500“)作为值，而不是作为暗函数的参数时，它会正常工作。
您能解释一下我错了什么，以及如何在配置文件中定义颜色值吗？
浏览 7提问于2022-03-06得票数 2
回答已采纳
1回答
描述错误模块构建失败
预期行为没有出现错误并成功编译了项目
截图
**`模块构建失败(来自./node_sass/sass-加载程序/dist/cjs.js)：SassError:找不到目标选择器。使用"@extend .animated！可选“来避免此错误。
.animated@╷10│@│；│^^^^^^^^^^^^^^^^^╵‘**
桌面(请填写以下信息)：
MacOSBrowser OS: FireFox
附加上下文将我的项目从webpack的v3迁移到webpack5。在通过webpack执行项目时，我遇到了上述具体错误。构建失败并产生这些错误。
浏览 2提问于2021-03-25得票数 0
1回答
导入变量scss
、、、
我第一次使用scss
我在src/样式/variables.scss中创建了一个文件
$background-color: #323132;
然后在src/Component.module.scss上
@use "src/styles/variables";
.content {
background-color: variables.$background-color;
}
我得到了
SassError: Invalid CSS after "...olor: variables": expected expression (e.g. 1px, bo
浏览 4提问于2021-06-03得票数 0
回答已采纳
2回答
我有一个变量文件，其中有两个要覆盖的主题定义：
_vars.scss
body {
$bg-color: #fff
}
body.theme-dark {
$bg-color: #333
}
我正在调用角按钮组件中的变量：
button.scss
@import '_vars.scss';
.button {
background-color: $bg-color;
}
但是我得到了以下编译错误：
SassError:未定义变量.
背景色：$bg颜色；
根据我的body主题类，覆盖变量的正确方法是什么？谢谢
浏览 4提问于2022-05-19得票数 -2
1回答
节点-sass甚至支持@use吗？因为我得到了这个错误：
SassError:在“.t-族:字体”之后无效的CSS :预期表达式(例如，1px，粗体)，是“.$roboto；
以下是Nav.scss的代码：
.nav {
width: 100%;
font-family: fonts.$roboto;
&__item {
margin-bottom: 10px;
font-size: variables.$a;
&_active {
color: rgb(37, 133, 34);
}
}
&__
浏览 1提问于2021-03-22得票数 1
回答已采纳
最近，我通过编辑package.json文件将我的angular应用程序从bootstrap4.5升级到5.1.1。 "dependencies": {
"bootstrap": "5.1.1"... 我在升级后遇到了以下问题。 ModuleBuildError: Module build failed (from ./node_modules/sass-loader/dist/cjs.js):
SassError: Undefined mixin.
╷
7 │ ┌ @include hover {
8 │ │ color
浏览 33提问于2021-09-16得票数 1
1回答
shared.scss：
.gridContainer {
display: grid;
background-color: #efefef;
}
my-component.scss
@import url("../../../shared.scss");
.contentWrapper {
@extend .gridContainer
}
当从角分量scss(my-component.scss)扩展到.gridContainer时，我得到了这个错误。这里的进口是可以的。可以这样延伸吗？如果不是，如何从shared.scss访问类或变量？
模块构建中的错误
浏览 6提问于2021-12-24得票数 3
回答已采纳
对不起，我有一个问题，我在我的文件general.scss中声明了一个scss变量$black，在我的文件default.vue中，我想使用她，但我有这个错误SassError: Undefined variable "$black"。
我的网站是用nuxt.js制作的！
如果您对我有任何回应或帮助，谢谢您，并为我糟糕的英语表示抱歉:)！
编辑
我不知道为什么，但是我的账号被阻塞了，所以我的问题的解决方案在这个教程中。
感谢你所有的时间(爱)
浏览 0提问于2020-11-13得票数 1
我正在处理一个react项目，当我试图使用类似@include这样的混音时，出现了编译错误：
╷
7 │ ┌ @include mobile {
8 │ │ flex-direction: column;
9 │ └ }
Module build failed (from ./node_modules/sass-loader/dist/cjs.js):
SassError: Undefined mixin.
我已经安装了软件包，并检查它是否安装不正确，我仍然得到这个错误，我能做什么？
代码：
@import "../../global.scss";
.c
浏览 32提问于2022-07-20得票数 2
1回答
我正在尝试像这样导入样式表@import"../../../../styles/forms.scss";
但是我得到了这个错误：
ERROR in Module build failed (from ./node_modules/sass-loader/dist/cjs.js):`
SassError: Can't find stylesheet to import.`
1 │ @import"../../../styles/variables.scss";
(它返回三次，而不是像我的路径中那样返回四次)
然后，当我再次返回(只是为了测试) ".
浏览 53提问于2020-07-30得票数 0
回答已采纳
1回答
这是个奇怪的问题。我从可能返回"TCP“或"UDP”的服务器请求链接类型。我想直接用字符串作为类名来表示不同的背景颜色。我想要的是：
<div className={`${styles.span} ${styles["[TCP]"]}`}/>
但是css选择器".TCP“是不允许的，下面的错误是：
SassError: Invalid CSS after "&": expected selector, was ".[TCP]"
现在我使用.replace(/\[|\]/g,"")拆分字符
浏览 1提问于2022-02-07得票数 0
回答已采纳
我正在尝试使用sass中的函数min和max。有两个不同类型的值，
width: max(55vw, 650px);
它给了我错误
SassError: Internal Error: Incompatible units: 'vw' and 'px'
此函数在普通css中运行良好，但在sass中不起作用。这是否意味着sass的功能比css功能有限，或者说我遗漏了什么？由于比较%和vw值与像素是最广泛使用的方式，如最小和最大。
我怎样才能使这件事在sass中发挥作用？
浏览 0提问于2021-07-22得票数 1
回答已采纳
长话短说，使用scss部分(强调文件名)似乎不工作时，结合别名？！还是我做错什么了？Webpack诉4.41
/core/styles/_core.scss
body { awesome: style }
/app/styles/style.scss
import '@core/core';
webpack.config.js
{
mode: 'development',
module: {
rules: [
{
test: /\.s[ac]ss$/i,
use: [
{
浏览 1提问于2019-11-26得票数 5
回答已采纳
5回答
在我的Nuxt应用程序中，我加载了所有的SASS，因此：
css: [
'~assets/scss/main.scss'
],
它工作得很好，除非我试图在组件中使用一些SASS变量。
<style lang="scss">
.container {
background-color: $white;
}
</style>
在本例中，我得到以下错误消息：
SassError:未定义变量：$white
然而，在定义变量的SASS文件中包含的所有SCSS都在整个应用程序中工作。
似乎整个应用程序都知道这些文件，但是每个单独的
浏览 3提问于2019-10-04得票数 1
回答已采纳
我有一个角度的网站，从npm和@ng-引导/ng-引导引导。我真的不喜欢默认的主题。我在bootswatch上找到了一些主题。我下载了'_variables.scss‘和’_bootswatch.scss.‘。
在我的style.css中，我使用了以下代码：
@import '~bootstrap/scss/bootstrap';
在我的angular.json中，我放置了以下样式配置：
...
"styles": [
"node_modules/bootstrap/dist/css/bootstrap.min.css
浏览 7提问于2022-04-01得票数 0
回答已采纳
嘿，我是scss的新手，我的代码中有一些错误。我正在为我的页面使用一个父类。这是我的css .d-layout {
.bg-img {
height: 304px;
width: 1140px;
}
.p-color: {
color: #A50034;
}
.ptd {
.icon {
height: 8px;
width: 8px;
transform: rotate(-90deg);
}
浏览 12提问于2020-01-23得票数 0
回答已采纳
在我的src/styles/variables.scss文件中，定义了$primary-color: #171b42;。
我想在我的src/components/LandingPage/LandingPage.module.scss文件中使用这个变量。
在这个文件里，我有：
@use "../../styles/variables.scss" as v;
$color: v.$primary-color;
.heading {
color: $color;
}
我知道这个错误：
SassError: Invalid CSS after "$color: v
浏览 3提问于2020-05-03得票数 3
回答已采纳
2回答
我需要复制一个页面，所以我用检查模式打开页面，看看它是什么样子，以便复制css样式。 但长方体阴影有一个问题。 来自inspect的值如下： box-shadow: rgb(13 13 13 / 10%) 0px 0.25rem 0.375rem 0px; 当我将它添加到我的代码(scss文件)中时，它抛出了这个错误： SassError: Function rgb is missing argument $green. 为什么会发生这种情况?如何解决？
浏览 11提问于2021-04-02得票数 0
回答已采纳
我试图将全局scss变量添加到我的vue项目中。
我发现(css技巧)和(vue学校)，我要做的就是在命令行中安装运行npm i node-sass sass-loader的sass加载程序。
在我的项目中还需要一个vue.config.js文件，其内容如下：
module.exports = {
css: {
loaderOptions: {
sass: {
prependData: `@import "@/styles/_variables.scss";`
}
}
}
};
其中_variables.scss是
浏览 26提问于2020-07-25得票数 3
回答已采纳
扫码
添加站长 进交流群
领取专属 10元无门槛券
手把手带您无忧上云
相关资讯
热门标签
云服务器
ICP备案
对象存储
实时音视频
即时通信 IM活动推荐
腾讯云开发者
