Not working with webpack2.1.0.beta22 and further

[eshimischi]

i have troubles with resolve-url-loader (1.6.0) and webpack2.1.0.beta25 my webpack.config.js:

const sourceMapQueryStr = (config.enabled.sourceMaps) ? '+sourceMap' : '-sourceMap';
const scssLoader = [
  `css-loader?${sourceMapQueryStr}?modules&importLoaders=2`,
  'postcss-loader',
  `resolve-url-loader?${sourceMapQueryStr}`,
  `sass-loader?${sourceMapQueryStr}`
];

module: {
    loaders: [
    {
        test: /\.css$/,
        include: config.paths.assets,
        loader: ExtractTextPlugin.extract({
          fallbackLoader: 'style',
          loader: [
            `css?${sourceMapQueryStr}`,
            'postcss'  
          ]
        })
      },{
        test: /\.scss$/,
        include: config.paths.assets,
        loader: ExtractTextPlugin.extract({fallbackLoader: 'style', loader: scssLoader.join('!')})  
   },
  resolve: {
    modules: [
      config.paths.assets,
      'node_modules',
      'assets/bower'
    ],
    enforceExtension: false
  },
plugins: [
new webpack.LoaderOptionsPlugin({
      minimize: config.enabled.minify,
      debug: config.enabled.watcher,     
      stats: { colors: true },
      quiet: true,
      options: {
        context: __dirname,
        postcss: [
          postcssCssnext({
            sourcemap: true,
            browsers: [
              'last 2 versions',
              'android 4',
              'opera 12',
            ]
          }),
          postcssBrowserReporter(),
          postcssReporter({
            clearMessages: true
          })
        ]
      }
    })
]

ERROR in ./styles/main.scss
Module build failed: ModuleBuildError: Module build failed: TypeError: Cannot read property 'path' of undefined
    at Object.resolveUrlLoader (/Volumes/Stuff/www/project/wordpress/*****/site/web/app/themes/*****-v1/node_modules/resolve-url-loader/index.js:38:55)
....
ERROR in ../~/css-loader?-sourceMap?modules&importLoaders=2!../~/postcss-loader!../~/resolve-url-loader?-sourceMap!../~/sass-loader?-sourceMap!./styles/main.scss
    Module build failed: TypeError: Cannot read property 'path' of undefined
        at Object.resolveUrlLoader (/Volumes/Stuff/www/project/wordpress/*****/site/web/app/themes/****-v1/node_modules/resolve-url-loader/index.js:38:55)

package.json:

"devDependencies": {
    "assets-webpack-plugin": "^3.4.0",
    "autoprefixer": "^6.4.1",
    "babel-cli": "^6.14.0",
    "babel-core": "^6.14.0",
    "babel-eslint": "^6.1.2",
    "babel-loader": "^6.2.5",
    "babel-plugin-add-module-exports": "^0.2.1",
    "babel-plugin-lodash": "^3.2.9",
    "babel-plugin-transform-async-to-generator": "^6.8.0",
    "babel-plugin-transform-es2015-destructuring": "^6.9.0",
    "babel-plugin-transform-es2015-function-name": "^6.9.0",
    "babel-plugin-transform-function-bind": "^6.8.0",
    "babel-plugin-transform-object-rest-spread": "^6.8.0",
    "babel-plugin-transform-runtime": "^6.15.0",
    "babel-preset-es2015": "^6.14.0",
    "babel-preset-es2015-loose": "^8.0.0",
    "babel-preset-stage-0": "^6.5.0",
    "babel-register": "^6.14.0",
    "bower-files": "^3.14.1",
    "browser-sync": "^2.16.0",
    "clean-webpack-plugin": "^0.1.10",
    "copyfiles": "^1.0.0",
    "css-loader": "^0.25.0",
    "cssnano": "^3.7.5",
    "eslint": "^3.5.0",
    "eslint-loader": "^1.5.0",
    "eslint-plugin-babel": "^3.3.0",
    "eslint-plugin-import": "^1.15.0",
    "extract-text-webpack-plugin": "^2.0.0-beta.4",
    "file-loader": "^0.9.0",
    "gulp": "^3.9.1",
    "gulp-clean-css": "^2.0.12",
    "gulp-concat": "^2.6.0",
    "gulp-eslint": "^3.0.1",
    "gulp-rename": "^1.2.2",
    "gulp-sourcemaps": "^1.6.0",
    "gulp-uglify": "^2.0.0",
    "gulp-util": "^3.0.7",
    "imagemin-mozjpeg": "^6.0.0",
    "imagemin-webpack-plugin": "^1.1.0",
    "imports-loader": "^0.6.5",
    "lodash": "^4.16.1",
    "lodash-webpack-plugin": "^0.10.1",
    "minimist": "^1.2.0",
    "monkey-hot-loader": "github:rmarscher/monkey-hot-loader#webpack2-import",
    "node-sass": "^3.10.0",
    "optimize-css-assets-webpack-plugin": "^1.3.0",
    "postcss": "^5.2.0",
    "postcss-browser-reporter": "^0.5.0",
    "postcss-cssnext": "^2.8.0",
    "postcss-import": "8.1.0",
    "postcss-loader": "^0.13.0",
    "postcss-reporter": "^1.4.1",
    "postcss-url": "^5.1.2",
    "qs": "^6.2.1",
    "resolve-url-loader": "1.6.0",
    "sass-loader": "^4.0.2",
    "source-map-loader": "^0.1.5",
    "style-loader": "^0.13.1",
    "sync-request": "^3.0.1",
    "url-loader": "^0.5.7",
    "webpack": "2.1.0-beta.25",
    "webpack-dev-middleware": "^1.8.2",
    "webpack-hot-middleware": "^2.12.2"
  }

Asked the same question webpack/webpack#issuecomment-248894366

[rebebop]

@eshimischi did you find a solution to this?

[eshimischi]

@razagill nope!! i just commented the line :

 `resolve-url-loader?${sourceMapQueryStr}` 

i suppose that this is really a problem or with webpack or resolve module itself, tried to find the solution around the code

#L38

with no success

[rebebop]

@eshimischi Thanks, unfortunately I'm using bootstrap-loader so can't comment the usage. Hopefully we'll get a solution soon.

[bholloway]

Please take a look at this comment as it may be relevant.

I presume there are breaking changes with Webpack 2 but I have not had a chance to look into it.

I am not dog-fooding this loader right no so any assistance is appreciated.

[aloker]

A possible workaround for now:

Update line 36ff

  var loader      = this,
      filePath    = loader.context,
      outputPath  = this._compilation.outputOptions.path,
      contextPath = this._compilation.options.context;

Using _compilation is considered hacky but at least mentioned in the documentation.

At least this works for now.

[eshimischi]

@aloker wow! thanks, yes indeed it works now!

[mlegenhausen]

Instead of modifing the code you can use

new webpack.LoaderOptionsPlugin({
  options: {
    context: path.join(__dirname, 'src'),
    output: {
      path: path.join(__dirname, 'www')
    }
  }
})

This LoaderOptionsPlugin simulates the options which where previously given to the plugin via loader.options.

[eshimischi]

@mlegenhausen yes, its much much better! appreciate your tip!

[jqjjian]

@mlegenhausen good! thanks!

[mschipperheyn]

It looks like no release was deployed after this fix. Could a beta be released so we don't have to monkey patch this every time?

[bholloway]

The preferred workaround would be loader-options-plugin.

Unless the code change is compatible with webpack 1.