0

I have a question regarding @import .LESS files. For compilation into CSS I use Prepros (http://prepros.io/).

My current project's structure is:

- all_projects/
---- assets/
------ partials/
-------- partial1.less
-------- partial2.less
------ mixins.less
---- project/
------ project_styles.less
------ variables.less

I need to include mixins.less and all partilas from the assets/partials/ folder into project_styles.less. I tried to @import them in an obviuos way "../assets..." but it didn't work. Here's a code example:

project_styles.less

@import '../assets/mixins.less';
@import 'variables.less';
@import '../assets/partials/partial1.less';
@import '../assets/partials/partial2.less';

I tried several solutions found at Stackowerflow etc (http://goo.gl/yvtpFb) but none on them worked.

Can you please point me into right direction how to achieve this? Thank you in advance!

Best regards, Alex

Nekto
  • 327
  • 1
  • 4
  • 16

2 Answers2

0

The way you described this is the way it should work.

You could try this with grunt of gulp and the gulp/grunt-less package. I think the application you use has some issues. If gulp/grunt is not an option you could try to adjust the folder structure. Try:

- all_projects/
-- project/
---- partials/
------ partial1.less
------ partial2.less
------ mixins.less
------ variables.less
---- project_styles.less

This way you keep all the partials together mixins and variables are soft of partials also.

Imports then should be like this:

@import '../project/partials/partial1.less';
@import '../project/partials/partial2.less';
@import '../project/partials/mixins.less';
@import '../project/partials/variables.less';
pwavg
  • 284
  • 3
  • 15
  • Thank you for the answer. Unfortunately, it's useless to unite all projects in the same folder because in this case I'll get a messy structure. That's why I need each project (done for separate customer) in its separate folder. Anyway, thanks for your suggestion :) – Nekto Sep 29 '15 at 14:28
  • I was suggesting a solution that maybe would solve your issue. I think your problem lies within the application you work with not the way how the Less syntax should work – pwavg Sep 30 '15 at 07:27
  • Yes, I've asked the app's author why this happened. But unfortunately I didn't receive any answer yet. – Nekto Sep 30 '15 at 12:20
0

I don't know how prepros.io works but LESS has http://lesscss.org/usage/#using-less-in-the-browser-options to set compiling process and of these is the following:

relativeUrls: false

According to docs:

Optionally adjust URLs to be relative. When false, URLs are already relative to the entry less file.

I suggest you to look into this direction.

Luca Detomi
  • 5,564
  • 7
  • 52
  • 77
  • Thank you for the tip :) But these settings work for Less.js only. If I could use something like "config.rb" file as for Sass... Unfortunately, I didn't find such information yet. – Nekto Sep 29 '15 at 14:32