sass-loader@>=6.0.0

[bholloway]

A large change, intended as non-breaking.

• support sass-loader@>=6.0.0 (backward compatible)
• support less-loader (string source-map)
• attempt support for webpack2

Supersedes #31, #41, #44.
Hopefully fixes #36, #42.

Will probably be a major version bump to play it safe: discuss.

[Judahmeek]

Yarn won't let me pull af4b4fc because it comes after the latest version bump 1.6.1. Would you mind adding another version bump to make things more convenient?

This PR definitely has my vote, btw.

[bholloway]

@Judahmeek I prefer not to mess with pre-release because of how easy it is to break latest dist-tag.

I have reports from others that this is a good fix, so I will probably release on that basis. (There are always unexpected issues that need to be patched following.) Anyone can please let me know if they object to that plan.

[bholloway]

There is still an incompatibility with webpack@~1.0.0 and node-sass@>=4.0.0. I have updated dependencies (in case it is fixed in source-maps) but to no avail.

According to this comment by @jhnns it is a known issue. However it would be nice if I could get independent confirmation that it is not just my setup.

In the absence of further information I intend to adjust the readme.md to give guidance that users with Webpack 1 and SASS loader may be limited to node-sass@~3.0.0, and to then release. Again let me know any objections/suggestions.

[bholloway]

Published as 2.0.0. Let me know any problems.

[BerndWessels]

@bholloway Just updated to sass-loader@6.0.2 and resolve-url-loader@2.0.0 and its breaking :(

Before it worked just fine with sass-loader-5.0.1 and resolve-url-loader-1.6.1.

Any idea how to fix it?

This is my webpack config:

config.module.rules.push(
      {
        test: /(\.scss|\.css)$/,
        exclude: [/node_modules/, /normalize.css/, /icomoon/],
        loader: `style-loader!css-loader?{"sourceMap":true,"modules":true, "importLoaders":2, "localIdentName": "[path]---[name]---[local]---[hash:base64:5]"}!postcss-loader!resolve-url-loader!sass-loader?{"sourceMap":true,"includePaths":["${themePath}"]}`
      }

And this is the error (I get multiple of these errors, basically for each import):

ERROR in ./~/css-loader?{"sourceMap":true,"modules":true, "importLoaders":2, "localIdentName": "[path]---[name]---[local]---[hash:base64:5]"}!./~/postcss-loader!./~/sass-loader/lib/loader.js?{"sourceMap":true,"includePaths":["C:/git/microsite-template-react/micros
ite/themes/fraedom"]}!./src/components/date-picker/days/styles.scss
Module build failed: SyntaxError: Bad string at line 1 column 44 of the JSON5 data. Still to read: "microsite-template-r"
    at error (C:\git\microsite-template-react\microsite\node_modules\json5\lib\json5.js:56:25)
    at string (C:\git\microsite-template-react\microsite\node_modules\json5\lib\json5.js:268:13)
    at value (C:\git\microsite-template-react\microsite\node_modules\json5\lib\json5.js:487:20)
    at array (C:\git\microsite-template-react\microsite\node_modules\json5\lib\json5.js:417:36)
    at value (C:\git\microsite-template-react\microsite\node_modules\json5\lib\json5.js:484:20)
    at object (C:\git\microsite-template-react\microsite\node_modules\json5\lib\json5.js:459:35)
    at value (C:\git\microsite-template-react\microsite\node_modules\json5\lib\json5.js:482:20)
    at Object.parse (C:\git\microsite-template-react\microsite\node_modules\json5\lib\json5.js:508:18)
    at parseQuery (C:\git\microsite-template-react\microsite\node_modules\sass-loader\node_modules\loader-utils\lib\parseQuery.js:20:16)
    at Object.getOptions (C:\git\microsite-template-react\microsite\node_modules\sass-loader\node_modules\loader-utils\lib\getOptions.js:8:10)
    at normalizeOptions (C:\git\microsite-template-react\microsite\node_modules\sass-loader\lib\normalizeOptions.js:21:37)
    at Object.sassLoader (C:\git\microsite-template-react\microsite\node_modules\sass-loader\lib\loader.js:40:21)
 @ ./src/components/date-picker/days/styles.scss 4:14-418 13:2-17:4 14:20-424
 @ ./src/components/date-picker/days/component.js
 @ ./src/components/date-picker/component.js
 @ ./src/components/date-input/component.js
 @ ./src/containers/demo-page/component.js
 @ ./src/component.js
 @ ./src/root.client.js
 @ multi babel-polyfill react-hot-loader/patch webpack-hot-middleware/client ./src/root.client.js

And these are my package versions:

+-- autoprefixer@6.7.5
+-- babel-core@6.23.1
+-- babel-loader@6.3.2
+-- babel-plugin-react-intl@2.3.1
+-- babel-plugin-transform-class-properties@6.23.0
+-- babel-plugin-transform-object-rest-spread@6.23.0
+-- babel-polyfill@6.23.0
+-- babel-preset-es2015@6.22.0
+-- babel-preset-latest@6.22.0
+-- babel-preset-react@6.23.0
+-- bundle-loader@0.5.4
+-- classnames@2.2.5
+-- clean-webpack-plugin@0.1.15
+-- connect-history-api-fallback@1.3.0
+-- connected-react-router@4.0.0-beta.4
+-- copy-webpack-plugin@4.0.1
+-- css-loader@0.26.1
+-- ejs@2.5.6
+-- exports-loader@0.6.3
+-- express@4.14.1
+-- extract-text-webpack-plugin@2.0.0-rc.3
+-- file-loader@0.10.0
+-- glob@7.1.1
+-- history@4.5.1
+-- html-loader@0.4.4
+-- html-webpack-plugin@2.28.0
+-- imports-loader@0.7.0
+-- intl@1.2.5
+-- json-loader@0.5.4
+-- moment@2.17.1
+-- node-sass@4.5.0
+-- normalize.css@5.0.0
+-- null-loader@0.1.1
+-- postcss-loader@1.3.1
+-- ramda@0.23.0
+-- raw-loader@0.5.1
+-- react@15.4.2
+-- react-dom@15.4.2
+-- react-history@0.18.2
+-- react-hot-loader@3.0.0-beta.6
+-- react-intl@2.2.3
+-- react-intl-po@2.0.1
+-- react-redux@5.0.3
+-- react-router@4.0.0-beta.6
+-- react-router-dom@4.0.0-beta.6
+-- redux@3.6.0
+-- redux-observable@0.13.0
+-- request@2.79.0
+-- reselect@2.5.4
+-- resolve-url-loader@2.0.0
+-- rimraf@2.6.0
+-- rxjs@5.2.0
+-- sass-loader@6.0.2
+-- style-loader@0.13.1
+-- tether@1.4.0
+-- url-loader@0.5.7
+-- webpack@2.2.1
+-- webpack-dev-middleware@1.10.1
+-- webpack-hot-middleware@2.17.0
`-- whatwg-fetch@2.0.2

[bholloway]

Strange that resolve-url-loader is in your config but not in your error message. The error message should show all the loaders. Maybe it is truncated on this device I'm reading on.

[BerndWessels]

@bholloway Hi thanks, no worries.

It seems I've got a problem with my sass-loader "includePaths":["${themePath}"] which is most likely unrelated to this.