Skip to content

SassError: Invalid CSS after " ": expected 1 selector or at-rule, was "{"  #1707

Open
@panhaoyu

Description

@panhaoyu

Version

16.0.0-beta.4

Reproduction link

https://github.com

Steps to reproduce

vue create site
choose vue3 and sass
change App.vue style like this:

<style lang="sass">
    #app
        font-family: Avenir, Helvetica, Arial, sans-serif
        -webkit-font-smoothing: antialiased
        -moz-osx-font-smoothing: grayscale
        text-align: center
        color: #007dff
        margin-top: 60px
</style>

make sure that #App has 4 space indent.

npm run serve, error.

What is expected?

serve

What is actually happening?

abrupt


this is an available work around: add a line in node_modules/sass-loader/dist/index.js:

function loader(content) {
    const options = (0, _loaderUtils.getOptions)(this);

to

function loader(content) {
    content = content.replace(/^[ \r\n]*/, '')
    const options = (0, _loaderUtils.getOptions)(this);

Metadata

Metadata

Assignees

No one assigned

    Type

    No type

    Projects

    No projects

    Milestone

    No milestone

    Relationships

    None yet

    Development

    No branches or pull requests

    Issue actions