0

私はsassファイルを持っています：sitemap.scss

以下のみが含まれます (現時点では)。

.hero {
    height: 600px;
    background: none;
}

私は、これまでのところ、sass を完全にコンパイルした gulp-sass を使用しています。

このファイルをコンパイルするときの出力エラーは次のようになります。

Error in plugin 'gulp-sass'
Message:
    assets/styles/source/components/sub-pages/sitemap.scss
Error: Invalid CSS after ".hero {": expected "}", was "{"
        on line 1 of assets/styles/source/components/sub-pages/sitemap.scss
>> .hero { {
   -------^

Details:
    formatted: Error: Invalid CSS after ".hero {": expected "}", was "{"
        on line 1 of assets/styles/source/components/sub-pages/sitemap.scss
>> .hero { {
   -------^

    column: 8
    line: 1
    file: /Users/dvasquez/Sites/workspace/Development/branch3/site.com/assets/styles/source/components/sub-pages/sitemap.scss
    status: 1
    messageFormatted: assets/styles/source/components/sub-pages/sitemap.scss
Error: Invalid CSS after ".hero {": expected "}", was "{"
        on line 1 of assets/styles/source/components/sub-pages/sitemap.scss
>> .hero { {
   -------^

    messageOriginal: Invalid CSS after ".hero {": expected "}", was "{"
    relativePath: assets/styles/source/components/sub-pages/sitemap.scss

ここが奇妙になるところです。同じsassファイルを取り、次のように書くと:

.hero { height: 600px; background: none; }

それはうまくコンパイルされます。

これは何らかのエンコードの問題である可能性があると想定したため、ファイルを削除して新しいファイルを作成しました。同じ問題。誰かが以前にこのようなことに遭遇したことがありますか? 私のプロジェクトには他にも多くの sass ファイルがありますが、この動作を示すファイルはありません。

また、これに加えて、ファイルの 4 行バージョンを含むパーシャルをインポートしてみましたが、これも問題なく機能しました。

どんなアイデアでも大歓迎です。

4

2 に答える 2

0

ララベルミックス

Grant K Norwood の回答を拡張するには、Laravel mix を使用している場合は、次のように、インデントされたスタイルを 3 番目のパラメーターのプロパティとして渡します。

mix.sass('input.sass', 'output.css', {
    sassOptions: {
        indentedSyntax: false
    }
});

ドキュメント: https://laravel.com/docs/6.x/mix#sass

于 2020-01-16T04:12:36.453 に答える