Libsass: لم تعد وحدات CSS تعمل بعد التحديث إلى node-sass 4.0.0

تم إنشاؤها على ١٢ ديسمبر ٢٠١٦  ·  7تعليقات  ·  مصدر: sass/libsass

قبل التحديث (node-sass 1.13.1) ، نجح ما يلي دون أي مشاكل:

المدخلات

:global
    .my-global-class-name
        background-color: red

الآن أتلقى الخطأ التالي:

ERROR in ./~/css-loader?modules&importLoaders=2&camelCase&sourceMap!./~/postcss-loader?sourceMap=inline!./~/sass-loader?sourceMap!./app/styles/modules/resourceForm.sass
Module build failed:
        .my-global-class-name
       ^
      Illegal nesting: Only properties may be nested beneath properties.
      in .../app/styles/modules/resourceForm.sass (line 7, column 9)
 @ ./app/styles/modules/resourceForm.sass 4:14-254 13:2-17:4 14:20-260

معلومات الإصدار:

$ node-sass --version
node-sass   4.0.0   (Wrapper)   [JavaScript]
libsass     3.4.0   (Sass Compiler) [C/C++]
  • إصدار NPM ( npm -v ): 3.10.3
  • إصدار العقدة ( node -v ): 6.7.0
  • عملية العقدة ( node -p process.versions ):
    {http_parser: "2.7.0"،
    العقدة: '6.7.0' ،
    الإصدار 8: '5.1.281.83'،
    الأشعة فوق البنفسجية: '1.9.1' ،
    zlib: '1.2.8' ،
    آريس: "1.10.1-DEV" ،
    icu: '57 .1 '،
    الوحدات: "48" ،
    opensl: '1.0.2j'}
  • منصة العقدة ( node -p process.platform ): داروين
  • بنية العقدة ( node -p process.arch ): x64
  • إصدار node-sass ( node -p "require('node-sass').info" ):
    node-sass 4.0.0 (غلاف) [جافا سكريبت]
    libsass 3.4.0 (مترجم Sass) [C / C ++]
  • إصدارات npm node-sass ( npm ls node-sass ): [email protected]
picture delijah

التعليق الأكثر فائدة

delijah لقد تمكنت من الحصول على هذا العمل مرة أخرى بعد الترقية عن طريق الهروب من القولون أي

\:global
    .my-global-class-name
        background-color: red
picture mattfysh في ٢٨ ديسمبر ٢٠١٦
👍7

ال 7 كومينتر

هذا المشروع هو تطبيق للغة ساس. هدفنا هو أن نكون متوافقين بنسبة 100٪ مع Sass. نحن بصدد إغلاق هذه المشكلة نظرًا لأن Ruby Sass ينتج نفس الإخراج. في المستقبل ، يُرجى تأكيد اختلاف إخراج LibSass عن Ruby Sass قبل فتح إصدار.

إذا كنت ترغب في اقتراح ميزات أخطاء الملفات بلغة Sass ، فيرجى فتح مشكلة مع Sass - https://github.com/sass/sass

xzyfer picture xzyfer في ١٣ ديسمبر ٢٠١٦

تم تجميعه مع LibSass بسبب خطأ تم تصحيحه. هذا الرمز ليس Sass صالحًا ولا يجب تجميعه مطلقًا. يمكنك تأكيد ذلك عن طريق اختبار الكود الخاص بك مع Ruby Sass.

:global
    .my-global-class-name
        background-color: red

Error: Properties are only allowed within rules, directives, mixin includes, or other properties.
       If ":global" should be a selector, use "\:global" instead.
        on line 1 of test.sass
  Use --trace for backtrace.

رسالة خطأ Ruby Sass أفضل بكثير من رسالتنا وتقترح حلًا. لتغيير هذا السلوك ، ستحتاج إلى فتح طلب ميزة مع Ruby Sass

xzyfer picture xzyfer في ١٣ ديسمبر ٢٠١٦

تجدر الإشارة إلى أن بنية وحدة CSS صالحة بتنسيق scss

:global {
    .my-global-class-name {
        background-color: red
    }
}
xzyfer picture xzyfer في ١٣ ديسمبر ٢٠١٦
👍1

xzyfer هل تعرف لماذا :global غير صالح Sass؟ إنه محدد CSS صالح ومن المحتمل أن يصبح أكثر شيوعًا في المستقبل بمجرد استخدام المزيد من الأشخاص لمحدد :host عند كتابة مكونات الويب.

jhnns picture jhnns في ٢٧ ديسمبر ٢٠١٦
👍2

jhnns هناك عدة عناصر مختلفة في اللعب هنا. يستخدم البروتوكول الاختياري بناء الجملة القديم ذي المسافة البادئة.

:global
    .my-global-class-name
        background-color: red

في بناء الجملة هذا ، يكون للمحددات :foo معنى خاص. هذا المعنى يسبق تضمين محددات مسبقة : في CSS بحوالي عقد من الزمن. كما قلت أعلاه ، تغيير هذا السلوك ليس ضمن نطاق LibSass ويجب معالجته من قبل فريق Sass الرسمي .

من ناحية أخرى ، يضمن بناء جملة scss الأحدث (في الغالب) أن يكون مجموعة فائقة من CSS. لهذا السبب ، تعمل المحددات البادئة : كما هو متوقع.

xzyfer picture xzyfer في ٢٨ ديسمبر ٢٠١٦
👍1

delijah لقد تمكنت من الحصول على هذا العمل مرة أخرى بعد الترقية عن طريق الهروب من القولون أي

\:global
    .my-global-class-name
        background-color: red
mattfysh picture mattfysh في ٢٨ ديسمبر ٢٠١٦
👍7

mattfysh يمكنني تأكيد ذلك. استخدام "\" يحل المشكلة. الآن لم يعجبني sass-linter ؛) سأفتح مشكلة لذلك.

delijah picture delijah في ٢٨ أبريل ٢٠١٧
هل كانت هذه الصفحة مفيدة؟
0 / 5 - 0 التقييمات

القضايا ذات الصلة

GottZ picture GottZ  ·  3تعليقات
luiscla27 picture luiscla27  ·  10تعليقات
sgbeal picture sgbeal  ·  13تعليقات
xzyfer picture xzyfer  ·  7تعليقات
ashleykolodziej picture ashleykolodziej  ·  3تعليقات