Skip to content

HTTPS clone URL

Subversion checkout URL

You can clone with HTTPS or Subversion.

Download ZIP

Loading…

Wish: @import process .CSS file as LESS file #303

Closed
grobakh opened this Issue · 11 comments

9 participants

@grobakh

You wrote:
"
If you want to import a CSS file, and don’t want LESS to process it, just use the .css extension:
@import "lib.css"; The directive will just be left as is, and end up in the CSS output.
"
I want LESS to process my .css with @import command. Reason: not to reconfigure MIME types by adding .less.
Today I need to comment test: // this.css = /css$/.test(this.path);

Maybe invent some special syntax
@import! "lib.css"
@import "lib.css" --less --once
@import "lib.css" -lo
to force .css processing?

BR
Vlad D.

@wvl

I'm not sure what you mean by "process my css". Either it's css and doesn't need processing, or it's a less file and does need processing.

However, perhaps you are getting at what I would like -- I would like to be able to include a css file inside a less file. This is useful for bundling the css into one file. Right now you need to rename the css file to .less so that the @import command will bundle them together. You end up losing meaning, if that file does not have any less commands in it.

I started working on an @include command that would simply add the css file 'as is' to the output. Perhaps that would work?

@include "reset.css"
@import "base"

@jamie-pate

I've done this, see #315
you just have to rename your '.css' file '.less.css'

@grobakh

Cool!

BR
Vlad D.

@grobakh grobakh closed this
@tonyxiao

Is there any way to inline css imports? It's not processing per se but rather concatenating.

@jamie-pate

Not sure exactly what this would buy you, are you looking to include the variables you created in the imported file?

either way this sounds like a fresh support request, this one only deals with including more file types with the @import rule

@yaroslav-ulanovych

I have the same need. And not only me: http://stackoverflow.com/questions/11196915/import-css-file-into-less-file. I want to use some jquery ui styles in my less files. It's obvious that I can't rename jquery-ui.css because jquery ui gets broken than. And such thing doesn't work:

@import "jquery-ui/css/start/jquery-ui.css";
.my-style {
    .ui-icon; /*less doesn't know ui-icon*/
}

I believe that isn't hard to implement.

@jamie-pate

@yaroslav-ulanovych: This sounds like a whole new feature (actually importing symbols from css)
vs concatenating css into a less file (which is what happens now)

This issue was merely a request to treat '.less.css' files exactly like '.less' files.

you could probably treat '.css' files like '.less' files to get this effect since less is a superset of css.

you could do this in your copy of the code by tweaking this line jamie-pate@c37bf80 in a slightly different way

@aslakhellesoy

Here is how I worked around it:

#!/bin/bash
#
# This script renames renames all .css files under components to .less
# This is to work around less' inability to @include a .css file.
#
for file in `find components -type f -name "*.css"` ; do
  mv ${file} ${file%.css}.less
done
@jonschlinkert

Less.js can import css files as of version 1.4.0:

@import (less) "styles.css";
@matthew-dean

Correct. This feature has been implemented. We can re-open issue if it's not working correctly with the beta.

@matthew-dean matthew-dean reopened this
@gaurav21r

+1 !

@javisantana javisantana referenced this issue from a commit in CartoDB/carto
@springmeyer springmeyer fix #303 cfab4f6
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Something went wrong with that request. Please try again.