CODEWITHSUNDEEP
csswebpacksasscss-loaderlibsass
Ares
Ares

Reputation: 1461

Ignore style declaration without value is SCSS

In my scss file I am importing a third-party css file

  @import 'icons/third-party-icons/style';

Unfortunately, this style is missing the value for the color style

.mySelector {
  content: "\eac2";
  margin-left: -1em;
  color: ;
}

As expected, node-sass is throwing the following error:

ModuleBuildError: Module build failed (from ./node_modules/sass-loader/lib/loader.js):

color: ; ^ Style declaration must contain a value

Is there any way to configure node-sass to ignore this invalid property?

Upvotes: 0

Views: 1109

Answers (3)

Ritwik Math
Ritwik Math

Reputation: 44

Instead of importing it you can download the CSS code if possible and save it in your project locally then solve the issues manually. It won't matter what you do later in your CSS file, the error will appear. Or else you can try to link the CSS in the header. If you are using PHP or similar serverside scripting then create a separate header.php (for example) and include it into every file. This way you will need to copy and paste the link once and you can access the style at every page.

Upvotes: 0

Mihail Minkov
Mihail Minkov

Reputation: 2631

In my opinion, that error report is there for a reason, you shouldn't have empty definitions as that is technically an error. In unminified CSS you wouldn't have an issue it would just appear as strikethrough in the element inspector in the browser, but in this case you break the minify process.

Upvotes: 0

landscapelizard
landscapelizard

Reputation: 1

You could override the imported css. The code is looking to use a value, but can't because it's null.

You could include in your style tags:

.mySelector {
    color: black !important;
}

That !important will override whatever is imported from the stylesheet, and you class in the body will use that color instead of trying to use the null color.

Upvotes: -1

Related Questions