preset-scss: default to dart-sass about presets

[shilman]

Pretty exciting! I'd say let's do this in two steps:

1. Update the docs
2. Update the preset after we've gotten some feedback

What do you think?

[Grawl]

When I do that, there's an error:

        border: 1px solid black
                                                                                                                                                                                                                          ^
      Expected newline.

Grawl/storybook-craco-example@4bcc084

/Users/daniilpronin/.nvm/versions/node/v12.16.2/bin/node /Users/daniilpronin/.nvm/versions/node/v12.16.2/lib/node_modules/yarn/bin/yarn.js run storybook
yarn run v1.22.4
$ start-storybook -p 9009 -s public
info @storybook/react v5.3.18
info 
info => Loading static files from: /Users/daniilpronin/Sites/uibook-craco-example/public .
info => Loading presets
info => Loading presets
info => Adding stories defined in ".storybook/main.js".
WARN `@storybook/preset-scss` may not be compatible with `@storybook/preset-create-react-app`
info => Loading Webpack configuration from `node_modules/react-scripts`
info => Removing existing JavaScript and TypeScript rules.
info => Modifying Create React App rules.
info => Using default Webpack setup.
webpack built 6cac0f9e919cbce34225 in 6042ms
✖ ｢wdm｣: Hash: 6cac0f9e919cbce34225
Version: webpack 4.43.0
Time: 6042ms
Built at: 05/13/2020 8:03:24 PM
                                          Asset       Size        Chunks                                Chunk Names
                            asset-manifest.json  472 bytes                [emitted]                     
                                    iframe.html   2.87 KiB                [emitted]                     
            main.6cac0f9e919cbce34225.bundle.js   17.9 KiB          main  [emitted] [immutable]         main
        main.6cac0f9e919cbce34225.bundle.js.map   5.71 KiB          main  [emitted] [dev]               main
    runtime~main.6cac0f9e919cbce34225.bundle.js   33.5 KiB  runtime~main  [emitted] [immutable]         runtime~main
runtime~main.6cac0f9e919cbce34225.bundle.js.map   34.7 KiB  runtime~main  [emitted] [dev]               runtime~main
    vendors~main.6cac0f9e919cbce34225.bundle.js   2.34 MiB  vendors~main  [emitted] [immutable]  [big]  vendors~main
vendors~main.6cac0f9e919cbce34225.bundle.js.map   2.37 MiB  vendors~main  [emitted] [dev]               vendors~main
Entrypoint main [big] = runtime~main.6cac0f9e919cbce34225.bundle.js runtime~main.6cac0f9e919cbce34225.bundle.js.map vendors~main.6cac0f9e919cbce34225.bundle.js vendors~main.6cac0f9e919cbce34225.bundle.js.map main.6cac0f9e919cbce34225.bundle.js main.6cac0f9e919cbce34225.bundle.js.map
[0] multi ./node_modules/@storybook/core/dist/server/common/polyfills.js ./node_modules/@storybook/core/dist/server/preview/globals.js ./.storybook/generated-entry.js ./node_modules/webpack-hot-middleware/client.js?reload=true&quiet=true 64 bytes {main} [built]
[./.storybook/generated-entry.js] 227 bytes {main} [built]
[./node_modules/@storybook/core/dist/server/common/polyfills.js] 120 bytes {vendors~main} [built]
[./node_modules/@storybook/core/dist/server/preview/globals.js] 93 bytes {vendors~main} [built]
[./node_modules/@storybook/core/node_modules/webpack/buildin/harmony-module.js] (webpack)/buildin/harmony-module.js 573 bytes {vendors~main} [built]
[./node_modules/@storybook/core/node_modules/webpack/buildin/module.js] (webpack)/buildin/module.js 497 bytes {vendors~main} [built]
[./node_modules/@storybook/react/dist/client/index.js] 1.34 KiB {vendors~main} [built]
[./node_modules/airbnb-js-shims/index.js] 40 bytes {vendors~main} [built]
[./node_modules/core-js/features/symbol/index.js] 359 bytes {vendors~main} [built]
[./node_modules/global/window.js] 232 bytes {vendors~main} [built]
[./node_modules/querystring-es3/index.js] 127 bytes {vendors~main} [built]
[./node_modules/regenerator-runtime/runtime.js] 23.6 KiB {vendors~main} [built]
[./node_modules/webpack-hot-middleware/client-overlay.js] 2.17 KiB {vendors~main} [built]
[./node_modules/webpack-hot-middleware/client.js?reload=true&quiet=true] 7.68 KiB {vendors~main} [built]
[./node_modules/webpack-hot-middleware/node_modules/strip-ansi/index.js] 161 bytes {vendors~main} [built]
    + 640 hidden modules

ERROR in ./src/components/button.sass (./node_modules/css-loader/dist/cjs.js!./node_modules/sass-loader/lib/loader.js??ref--5-2!./node_modules/style-loader!./node_modules/css-loader/dist/cjs.js??ref--8-oneOf-5-1!./node_modules/postcss-loader/src??postcss!./node_modules/sass-loader/lib/loader.js??ref--8-oneOf-5-3!./src/components/button.sass)
Module build failed (from ./node_modules/sass-loader/lib/loader.js):

        border: 1px solid black
                                                                                                                                                                                                                          ^
      Expected newline.
  ╷
2 │ var content = require("!!../../node_modules/css-loader/dist/cjs.js??ref--8-oneOf-5-1!../../node_modules/postcss-loader/src/index.js??postcss!../../node_modules/sass-loader/lib/loader.js??ref--8-oneOf-5-3!./button.sass");
  │                                                                                                                                                                                                                            ^
  ╵
  stdin 2:220  root stylesheet
      in /Users/daniilpronin/Sites/uibook-craco-example/src/components/button.sass (line 2, column 220)
 @ ./src/components/button.sass 2:14-357 21:1-42:3 22:19-362
 @ ./src/components/button.jsx
 @ ./src/stories/1-Button.stories.js
 @ ./src sync ^\.\/(?:(?:(?!\.)(?:(?:(?!(?:|\/)\.).)*?)\/)?(?!\.)(?=.)[^/]*?\.stories\.js\/?)$
 @ ./.storybook/generated-entry.js
 @ multi ./node_modules/@storybook/core/dist/server/common/polyfills.js ./node_modules/@storybook/core/dist/server/preview/globals.js ./.storybook/generated-entry.js ./node_modules/webpack-hot-middleware/client.js?reload=true&quiet=true
Child HtmlWebpackCompiler:
                          Asset      Size               Chunks  Chunk Names
    __child-HtmlWebpackPlugin_0  6.48 KiB  HtmlWebpackPlugin_0  HtmlWebpackPlugin_0
    Entrypoint HtmlWebpackPlugin_0 = __child-HtmlWebpackPlugin_0
    [./node_modules/@storybook/core/node_modules/html-webpack-plugin/lib/loader.js!./node_modules/@storybook/core/dist/server/templates/index.ejs] 2.13 KiB {HtmlWebpackPlugin_0} [built]

WARN Broken build, fix the error above.
WARN You may need to refresh the browser.