Hi,
Node Version - 1.6.0
NPM Version - 6.5.0
grunt-contrib-less Version - 1.4.1
I'm working on a multi-site project where it requires shared resources and I'm having an issue when using the paths option. When I include the paths option and import a less file in my main style sheet. It rolls up to the path I wanted separate from the root. The problem is when I import a less file relative to the main style sheet and then include that same import line into the imported file. It doesn't roll up to the shared resource.
Gruntfile configuration for paths:
options: {
paths: './less/_shared',
}
Example of the proper roll up when not loaded relative to the main less file:
less/_shared/sample.less
body {
background-color: white;
}
less/brands/style.less
Final output:
.body { background-color: white; }
That's to be expected. Now when I add the same file relative to style.less and include the import to get the shared one it doesn't import it.
Example of the improper roll up when loading a relative to the main less file:
less/_shared/sample.less
body {
background-color: white;
}
less/brands/sample.less
@import 'sample.less';
main {
background-color: red;
}
less/brands/style.less
Final output:
main{ background-color: red; }
When I would expect to see:
body { background-color: white;
main{ background-color: red; }
I do have a work around that will get the shared file when adding a preceding slash it the import. I don't want to in my production code but it works.
Example
less/brands/sample.less
@import '/sample.less';
main {
background-color: red;
}
less/brands/style.less
Final output:
body { background-color: white;
main{ background-color: red; }
I've utilized this same approach with Grunt/Compass and Webpack/SASS but can't seem to achieve the same effect with Less. Any help with resolving this would be greatly appreciated.
Hi,
I'm working on a multi-site project where it requires shared resources and I'm having an issue when using the paths option. When I include the paths option and import a less file in my main style sheet. It rolls up to the path I wanted separate from the root. The problem is when I import a less file relative to the main style sheet and then include that same import line into the imported file. It doesn't roll up to the shared resource.
Gruntfile configuration for paths:
Example of the proper roll up when not loaded relative to the main less file:
less/_shared/sample.less
less/brands/style.less
Final output:
That's to be expected. Now when I add the same file relative to style.less and include the import to get the shared one it doesn't import it.
Example of the improper roll up when loading a relative to the main less file:
less/_shared/sample.less
less/brands/sample.less
less/brands/style.less
Final output:
When I would expect to see:
I do have a work around that will get the shared file when adding a preceding slash it the import. I don't want to in my production code but it works.
Example
less/brands/sample.less
less/brands/style.less
Final output:
I've utilized this same approach with Grunt/Compass and Webpack/SASS but can't seem to achieve the same effect with Less. Any help with resolving this would be greatly appreciated.