Specifying options.loaders.scss|sass for vue-loader fails to work

[pixeloution]

I'm not nearly a webpack expert but I've copied some config info from the VueJS website and I'm adding some configuration via Encore as follows:

.enableVueLoader(options => {
  options.loaders = {};
  options.loaders.scss = "vue-style-loader!css-loader!sass-loader";
  options.loaders.sass = "vue-style-loader!css-loader!sass-loader?indentedSyntax";
 }, { runtimeCompilerBuild : false })

This should enable both sass and scss syntax in a vue file, ie.

<style lang="scss">
.rule {
  width : 100px;
}
</style>

<style lang="sass">
.rule
  width : 100px
</style>

The actual error received is:

Module build failed (from ./node_modules/sass-loader/dist/cjs.js):
SassError: expected "{".

Which indicates its only accepting the SCSS syntax not the SASS (indented, no braces) syntax. The default behavior for node-sass is to allow either syntax based on file extension -- and I've validated that works properly.

[stevenroh]

Hi,

Not sure it's related but I got the same error (SassError: expected "{".) inside <style lang="sass">.

To solve this, I specified the indentedSyntax like this (on the sass loader) :

.enableSassLoader(options => { 
   options.sassOptions.indentedSyntax = true;
})

[carsonbot]

Thank you for this issue.
There has not been a lot of activity here for a while. Has this been resolved?

[carsonbot]

Thank you for this issue.
There has not been a lot of activity here for a while. Has this been resolved?

[carsonbot]

Friendly ping? Should this still be open? I will close if I don't hear anything.

[carsonbot]

Hey,

I didn't hear anything so I'm going to close it. Feel free to comment if this is still relevant, I can always reopen!