import with absolute paths

wclr commented 8 years ago

I have imports in less files:

@import "/styles/imports/mixins";

Got the error:

ERROR in ./client/~/css-loader!./client/~/less-loader?{lessOptions}
Module build failed: Can't resolve **'.//styles/imports/mixins.less'**

in lessOptions I passed {paths: [absoulte path to directory where /styles dir is located]}

nicolas-goudry commented 8 years ago

I'm also stuck with this issue, any workaround / config to ship ?

Actually I handle that by doing @import "../../../styles/settings/all"; but it's clearly not the right way to do this…

In my webpack.config.js:

webpackConfig.module.loaders.push({
  test: /\.less/,
  include: cssModulesRegex,
  loaders: [
    'style',
    cssModulesLoader,
    'postcss',
    'less?sourceMap'
  ]
})

/* … */

webpackConfig.lessLoader = {
  includePaths: paths.client('styles')
}

Also, imports from node_modules doesn't work: @import "~normalize.css/normalize.css"; but if I use @import "normalize.css/normalize.css";, it works…

vangheem commented 7 years ago

Any reason why this was closed? This is still an issue where absolute paths do not get resolved correctly. This includes absolute urls that are generated with variables like @import "@{pathVariable}/foobar";

n1ru4l commented 7 years ago

I can confirm this @vangheem

alexander-akait commented 7 years ago

import using absolute paths can weird and incorrect behavior. Who can demonstrate use case and explain that only with absolute paths is it possible?

n1ru4l commented 7 years ago

I have a use case. I want to load a .less file which includes variables for a theme. The users should be able to specify the path of the theme.

Atm. absolute paths are prefixed with ./

Example:

const defaultTheme  =  `themes/variables/default.less`
const themeDir = path.resolve(__dirname, `..`, defaultTheme) // /Users/my-user/Projects/private/muse-ui/themes/variables/default.less

const loader = {
  loader: `less-loader`,
  options: {
    globalVars: {
      theme: `'${themeDir}'`
    }
  }
}

The webpack output is the following:

Module build failed: Can't resolve './/Users/sum-user/Projects/private/muse-ui/themes/variables/default.less' in '/Users/sum-user/Projects/private/muse-ui/src/styles'
 @ /Users/sum-user/Projects/private/muse-ui/src/styles/import.less (line 1, column 0)
 near lines:

   @import "@{theme}";

alexander-akait commented 7 years ago

@n1ru4l Can't resolve './/Users/sum-user/Projects/private/muse-ui/themes/variables/default.less' - seems something is wrong with path. Be good if your show full stack trace of error.

n1ru4l commented 7 years ago

@evilebottnawi I know that something is wrong with the path. Because it should not get prefixed with ./... if you enter cat /Users/sum-user/Projects/private/muse-ui/themes/variables/default.less into the terminal the file contents are shown...

alexander-akait commented 7 years ago

@n1ru4l I think I can look what's wrong in this week. Now overloaded :disappointed: Just ping me in friday, if no information here or will not be PR

n1ru4l commented 7 years ago

@evilebottnawi Here is the case, there is nothing more to describe.. https://github.com/n1ru4l/less-loader-absolute-paths

webpack-contrib / less-loader

import with absolute paths #93