Import .css file in Less using nodejs gulp
Asked Answered
W

1

8

According to this question it's possible to import css file from less v.1.4.0.
I tried to use gulp-less task, and it's not working.
There's any way to import css file like this: @import "../spritesheet.css"; with nodeJS gulp?

Wellborn answered 19/4, 2015 at 8:13 Comment(2)
Define "it's not working"? What is it that you're trying to achieve exactly? Do you need to access classes defined in the .css file for re-use in the .less file?Slippery
events.js:72 throw er; // Unhandled 'error' event ^ Error: Broken @import declaration of "../spritesheet.css"Wellborn
S
7

There are several ways to include files in LESS, depending on what you need, using @import ([keyword]) "filename".

Allowed keywords are:

  • reference: use a Less file but do not output it
  • inline: include the source file in the output but do not process it
  • less: treat the file as a Less file, no matter what the file extension
  • css: treat the file as a CSS file, no matter what the file extension
  • once: only include the file once (this is default behavior)
  • multiple: include the file multiple times
  • optional: continue compiling when file is not found

Lesscss.org - Import Options

It's not clear to me what your use case is, but if you want to use the contents of spritesheet.css further on in your LESS file (for example extending classes defined in your spritesheet) you need the (less) keyword.

If you just want to include the contents of spritesheet.css into your output file without accessing them from within the LESS file at all, stick with (inline).

Slippery answered 19/4, 2015 at 11:16 Comment(1)
@import (inline) is the answer!! Thanks!!Wellborn

© 2022 - 2024 — McMap. All rights reserved.