Ng-lazyload-image: لا يمكن قراءة الخاصية 'kind' من undefined - تطبيق Angular 7 Universal
تم تثبيت صورة ng-lazyload أمس وظهرت رسالة خطأ:
ERROR in ./node_modules/ng-lazyload-image/fesm5/ng-lazyload-image.js
Module build failed (from ./node_modules/@angular-devkit/build-optimizer/src/build-optimizer/webpack-loader.js):
TypeError: Cannot read property 'kind' of undefined
at isAngularDecoratorMetadataExpression (C:\Users\Denis\Desktop\Projects\VPWebsite\node_modules\@angular-devkit\build-optimizer\src\transforms\scrub-file.js:265:35)
at checkNodeForDecorators (C:\Users\Denis\Desktop\Projects\VPWebsite\node_modules\@angular-devkit\build-optimizer\src\transforms\scrub-file.js:77:21)
at visitNodes (C:\Users\Denis\Desktop\Projects\VPWebsite\node_modules\@angular-devkit\build-optimizer\node_modules\typescript\lib\typescript.js:16144:30)
at Object.forEachChild (C:\Users\Denis\Desktop\Projects\VPWebsite\node_modules\@angular-devkit\build-optimizer\node_modules\typescript\lib\typescript.js:16370:24)
عند الجري
بناء نانوغرام - المنتج
ولكن يبدو جيدًا مع خدمة _ng service_
هل يمكنك المساعدة ، لقد كنت أقاتل معها لأكثر من يوم واحد.
تبعياتي فقط في حالة:
"dependencies": {
"@angular/animations": "6.1.10",
"@angular/cdk": "6.4.7",
"@angular/common": "7.2.13",
"@angular/compiler": "7.2.13",
"@angular/core": "7.2.13",
"@angular/forms": "7.2.13",
"@angular/http": "7.2.13",
"@angular/material": "6.4.7",
"@angular/platform-browser": "7.2.13",
"@angular/platform-browser-dynamic": "7.2.13",
"@angular/platform-server": "7.2.13",
"@angular/router": "7.2.13",
"@ng-bootstrap/ng-bootstrap": "4.1.1",
"@ng-select/ng-select": "2.17.0",
"@ng-toolkit/pwa": "7.1.1",
"@ng-toolkit/universal": "7.1.1",
"@ngneat/content-loader": "^4.1.0",
"@nguniversal/express-engine": "7.1.1",
"@nguniversal/module-map-ngfactory-loader": "7.1.1",
"@ngx-meta/core": "7.0.0",
"@swimlane/ngx-charts": "^12.0.1",
"ajv-keywords": "3.4.0",
"angular2-yandex-maps": "1.0.42",
"bootstrap": "4.3.1",
"core-js": "2.6.5",
"crypto": "1.0.1",
"crypto-js": "^3.1.9-1",
"ejs": "^1.0.0",
"et-line": "1.0.1",
"express": "^4.16.4",
"font-awesome": "4.7.0",
"fs": "0.0.1-security",
"http": "0.0.0",
"jquery": "3.4.0",
"jsencrypt": "^3.0.0-rc.1",
"mock-browser": "^0.92.14",
"moment": "2.24.0",
"net": "1.0.2",
"ng-lazyload-image": "^7.1.0",
"ng-sidebar": "8.0.0",
"ng5-slider": "1.1.14",
"ngx-daterangepicker-material": "1.3.4",
"ngx-mat-daterange-picker": "1.1.4",
"ngx-owl-carousel": "2.0.7",
"owl.carousel": "2.3.4",
"path": "0.12.7",
"popper.js": "1.15.0",
"rxjs": "6.4.0",
"rxjs-compat": "6.4.0",
"stream": "0.0.2",
"webpack-bundle-analyzer": "3.3.2",
"zlib": "1.0.5",
"zone.js": "0.8.29"
},
"devDependencies": {
"@angular-devkit/build-angular": "0.13.9",
"@angular/cli": "7.3.8",
"@angular/compiler-cli": "7.2.13",
"@angular/language-service": "7.2.13",
"@types/jasmine": "2.8.16",
"@types/jasminewd2": "2.0.3",
"@types/node": "8.9.4",
"codelyzer": "4.5.0",
"http-server": "0.11.1",
"jasmine-core": "2.99.1",
"jasmine-spec-reporter": "4.2.1",
"karma": "^4.3.0",
"karma-chrome-launcher": "2.2.0",
"karma-coverage-istanbul-reporter": "2.0.5",
"karma-jasmine": "1.1.2",
"karma-jasmine-html-reporter": "0.2.2",
"protractor": "5.4.2",
"ts-loader": "5.3.3",
"ts-node": "7.0.0",
"tslint": "5.11.0",
"typescript": "3.1.1",
"webpack-cli": "3.3.0"
}
Denis-Evseev
ال 28 كومينتر
@ Denis-Evseev ، هل يمكنك محاولة الرجوع إلى إصدار سابق من هذا lib إلى الإصدار 7.0.1 (عن طريق ضبط التعديل فقط:
- "ng-lazyload-image": "^7.1.0",
+ "ng-lazyload-image": "7.0.1",
وتشغيل npm install مرة أخرى؟)
أريد فقط معرفة ما إذا كانت هذه المشكلة قد تم تقديمها في أحدث إصدار أم أنها كانت في إصدار سابق
tjoskar
في ٢٦ فبراير ٢٠٢٠
tjoskar - "7.0.1" لم يحل المشكلة ، ولا يزال يحصل على نفس الخطأ.
شكرا
Denis-Evseev
في ٢٦ فبراير ٢٠٢٠
tjoskar - أي أفكار؟
Denis-Evseev
في ٢٧ فبراير ٢٠٢٠
ما هو إصدار ng -cli الذي تستخدمه؟ لقد قمت بما يلي:
❯ ng --version
_ _ ____ _ ___
/ \ _ __ __ _ _ _| | __ _ _ __ / ___| | |_ _|
/ △ \ | '_ \ / _` | | | | |/ _` | '__| | | | | | |
/ ___ \| | | | (_| | |_| | | (_| | | | |___| |___ | |
/_/ \_\_| |_|\__, |\__,_|_|\__,_|_| \____|_____|___|
|___/
Angular CLI: 9.0.3
Node: 12.8.0
OS: darwin x64
Angular:
...
Ivy Workspace:
Package Version
------------------------------------------------------
@angular-devkit/architect 0.900.3
@angular-devkit/core 9.0.3
@angular-devkit/schematics 9.0.3
@schematics/angular 9.0.3
@schematics/update 0.900.3
rxjs 6.5.3
❯ ng new my-app
❯ cd my-app
❯ ng build --prod
Your global Angular CLI version (9.0.3) is greater than your local
version (8.0.6). The local Angular CLI version is used.
...
build OK
# Adding ng-lazyload-image
❯ ng build --prod
Your global Angular CLI version (9.0.3) is greater than your local
version (8.0.6). The local Angular CLI version is used.
...
ERROR in ./node_modules/ng-lazyload-image/fesm5/ng-lazyload-image.js
Module build failed (from ./node_modules/@angular-devkit/build-optimizer/src/build-optimizer/webpack-loader.js):
TypeError: Cannot read property 'kind' of undefined
...
# Upgrade angular to version 9 so that Angular CLI and the local version match
❯ ng build --prod
# Build complete without warning or error
لقد بحثت عن الخطأ في Google ويبدو أنه يمكن أن يحدث عندما يخطئ cli ونسخة Angular المحلية في التطابق. ما هو ناتج ng --version ؟
tjoskar
في ٢٧ فبراير ٢٠٢٠
مرحبًا ، لدينا نفس المشكلة في Angular 8 عند محاولة إنشاء ملفات SSR.
ng-lazyload صورة: 7.1.0
تحديث:
خفضت إلى 7.0.1 عملت بالنسبة لي ..
RFreij
في ٢٨ فبراير ٢٠٢٠
RFreij ، هل من الممكن أن تقوم بمحاذاة إصدار Angular CLI الخاص بك مع الإصدار المحلي الخاص بك (بحيث يختفي التحذير؟). على سبيل المثال. عن طريق ترقية إصدار Angular المحلي لديك إلى 8.3.25 ؟
tjoskar
في ٢٨ فبراير ٢٠٢٠
tjoskar هذا كان خياري الثاني الذي أردت تجربته بعد تخفيض التصنيف. ولكن يبدو أن الرجوع إلى الإصدار 7.0.1 قد نجح بالفعل بالنسبة لي.
سأحاول مع 7.1.0 ومع إصدار cli المحلي نفس الشيء بالنسبة لك. فقط لاستبعادها
RFreij
في ٢٨ فبراير ٢٠٢٠
tjoskar للأسف وجود إصدار cli محلي مماثل للعالم لم يعمل مع v7.1.0
RFreij
في ٢٨ فبراير ٢٠٢٠
tjoskarRFreij - أي أفكار حول كيفية إصلاح ذلك؟
Denis-Evseev
في ٤ مارس ٢٠٢٠
@ Denis-Evseev بالنسبة لي ، لقد عملت من خلال خفض التصنيف إلى 7.0.1
RFreij
في ٤ مارس ٢٠٢٠
لدي نفس المشكلة. الرجوع إلى الإصدار 7.0.1 لا يساعدني
fourAnge
في ٤ مارس ٢٠٢٠
ساعدني الرجوع إلى الإصدار 7.0.1 أيضًا: تادا:
Prozi
في ٦ مارس ٢٠٢٠
لا يمكنني إعادة إنتاج هذا بدون استخدام إصدار Angular CLI الذي لا يتوافق مع الإصدار المحلي من Angular. هل لدى أي شخص مشروع يمكن إعادة إنتاج هذه المشكلة فيه ، ويمكنك مشاركته معي؟
tjoskar
في ٧ مارس ٢٠٢٠
tjoskar حاولت إنشاء واحدة لك. ولكن يبدو أنه لا يمكنني إعادة إنتاجه على تثبيت جديد لـ Angular 8 .. كل من خدمة ng و ng build - المنتج يعملان بشكل جيد في التثبيت الجديد ..
RFreij
في ٧ مارس ٢٠٢٠
نفس الخطأ هنا مع إصدار مختلف من الزاوية ولكن أيضًا SSR
أخبرني إذا كانت هناك أي بيانات أو اختبار مطلوب. لقد اختبرت أيضًا مع 7.0.1 و 7.1.0
jmelich
في ٩ مارس ٢٠٢٠
لقد بحثت في goog عن المشكلة ووجدت أن الخطأ شائع للإصدارات الأقدم من الكتابة المطبوعة وأرى أنك تستخدم 3.2.4 الذي تم إصداره منذ أكثر من عام و 3.1.1 تم إصداره في سبتمبر 2018. هل من الممكن أن تحاول تحديث النسخة المطبوعة؟
tjoskar
في ٩ مارس ٢٠٢٠
أ- من قبل عندما حصلت على المشكلة
تبعيات الزاوي
"@ angular / animations": "^ 8.2.14"،
"@ الزاوي / المشترك": "~ 8.1.2"،
"@ angular / compiler": "~ 8.1.2"،
"@ angular / core": "~ 8.1.2"،
"@ الزاوية / النماذج": "~ 8.1.2"،
"@ angular / platform-browser": "~ 8.1.2"،
"@ angular / platform-browser-dynamic": "~ 8.1.2"،
"@ angular / router": "~ 8.1.2"،
تبعيات ديف
"@ angular-devkit / architecture": "~ 0.801.2"،
"@ angular-devkit / build-angular": "~ 0.801.2"،
"@ angular-devkit / core": "~ 8.1.2"،
"@ angular-devkit / schematics": "~ 8.1.2"،
"@ angular / cli": "~ 8.1.2"،
"@ angular / compiler": "~ 8.1.2"،
"@ angular / compiler-cli": "~ 8.1.2"،
"@ angular / language-service": "~ 8.1.2"،
"@ أيوني / مجموعة أدوات الزاوية": "~ 2.0.0"،
و "ng-lazyload-image": "^ 7.1.0" ،
ب- الآن بعد تصحيح المشكلة
كل شيء يبقى كما هو إلا
"ng-lazyload-image": "^ 7.0.1"،
"@ angular-devkit / build-angular": "~ 0.803.24"،
fourAnge
في ٩ مارس ٢٠٢٠
لقد رجعت إصدار lazy-image إلى 6.0.1 وهي تعمل الآن.
قبل ذلك ، حاولت ترقية الإصدار المطبوع بدون نتيجة ، نظرًا لأن أعلى إصدار مسموح به لمشروعي كان 3.3.0 نظرًا لأنني على angular7 ولست مهتمًا حاليًا بالترقية إلى angular8.
يتطلب الخطأ في مترجم Angular TypeScript> = 3.1.1 و <3.3.0 ولكن تم العثور على 3.8.3 بدلاً من ذلك.
jmelich
في ١١ مارس ٢٠٢٠
شكرا لردكمjmelich. فقط من باب الفضول ، لماذا لا تريد ترقية Angular؟ سينتهي اختبار LTS لـ Angular 7 في 18 أبريل ، لذا أعتقد أن الوقت قد حان :)
tjoskar
في ١٢ مارس ٢٠٢٠
لدينا الآن أولويات ومهام أخرى يجب القيام بها ، وبعد ذلك بالتأكيد سنقوم بتحديث هذا التطبيق إلى أحدث زاوية ولكن ليس الآن. كان هذا التعديل الأخير الذي شاركت فيه مكتبتك هو إجراء تحسين كبير على سرعة الصفحة بجهد بسيط نظرًا لاحتوائها على الكثير من الصور. بالمناسبة ، شكرًا لاهتمامك وحزمتك ، إنها تعمل بشكل جيد حقًا: P
jmelich
في ١٣ مارس ٢٠٢٠
jmelich لقد هاجرت إلى Angular 8 اليوم لمدة 30 دقيقة!
التحميل الكسول يعمل كالسحر الآن!
مستخدم: https://medium.com/better-programming/upgrade-to-angular-8-beta-within-10-minutes-cd831fb8dd0e
Denis-Evseev
في ١٧ مارس ٢٠٢٠
@ Denis-Evseev أنا أقدر حقًا الارتباط الخاص بك وسأحاول إذا أقرت أنه كان 30 دقيقة فقط :). في الواقع ، لدينا تطبيقان مصممان بزاوية ، كلاهما مع الإصدار 7 ولكن أحدهما كبير حقًا وبه العديد من الحلول للمتطلبات الغريبة والكثير من التبعيات. على أي حال يبدو أننا جميعًا لدينا الكثير من الوقت لنقضيه لذا سأحاول قريبًا. شكرا!
jmelich
في ٢٠ مارس ٢٠٢٠
أنا آسف لأن هذه مشكلة لكم جميعًا وأتمنى أن يكون لدي حل ولكني لا أعرف ما هي المشكلة. أنا متأكد تمامًا من أن له علاقة بإصدار الطباعة (والزاوية). أرغب في أن أكون قادرًا على إنشاء مشروع حيث يمكنني إعادة إنتاج المشكلة حتى أتمكن من تصحيحها ولكن في نفس الوقت سيتم إهمال Angular 7 في أقل من شهر ، ولن يكون مدعومًا من قبل فريق Angular بعد ذلك من قبلي أيضًا.
إذا كان بإمكان أي شخص مشاركة مشروع يمكن إعادة إنتاجه فيه ، فسوف ألقي نظرة عليه وأحاول إصلاحه.
tjoskar
في ٢٠ مارس ٢٠٢٠
@ Denis-Evseev ، هل يمكنك محاولة الرجوع إلى إصدار سابق من هذا lib إلى الإصدار
7.0.1(عن طريق ضبط التعديل فقط:- "ng-lazyload-image": "^7.1.0", + "ng-lazyload-image": "7.0.1",وتشغيل
npm installمرة أخرى؟)أريد فقط معرفة ما إذا كانت هذه المشكلة قد تم تقديمها في أحدث إصدار أم أنها كانت في إصدار سابق
أستطيع أن أؤكد أن هذا يعمل (الرجوع إلى إصدار سابق)
Prozi
في ٢١ مارس ٢٠٢٠
في الإصدار 7.1.0 قمت بترقية ng-packagr إلى الإصدار 9.0.0 ويبدو أن إصدارات TypeScript السابقة للإصدار 3.6.4 لم تعد مدعومة ، ولكن يبدو أن Angular 8 يدعم الكتابة المطبوعة من 3.4 إلى 3.7.
بالنسبة إلى Angular 7:
يبدو أنه من المفيد لمعظمكم الرجوع إلى إصدار ng-lazyload-image إلى إصدار 7.0.1 وبما أن فريق Angular سيتخلى عن دعم الإصدار 7 في غضون أسابيع قليلة (18 أبريل) فأنا لست كذلك متأكد من أنني سأصلح هذا. ومع ذلك ، سأقبل العلاقات العامة إذا أراد شخص ما:
- تحقق من هذا lib
- الرجوع إلى إصدار أقدم من
ng-packagrإلى 5.7.0 ونسخ الكتابة إلى 3.5.3 - الرجوع إلى إصدار سابق من بنية ts في هذا lib (المعروف أيضًا باسم إصلاح مشكلة TS التي ستظهر عند محاولة الإنشاء)
- إنشاء نسخة محلية من lib (npm run build && cd dist && npm pack)
- قم بتثبيت الحزمة في تطبيقك (تثبيت npm ../path/to/ng-lazyload-image/dist/ng-lazyload-image-7.1.0.tgz)
- قم بتشغيل
ng build --prodفي تطبيقك لمعرفة ما إذا كان الخطأ قد اختفى.
بالنسبة إلى Angular 8:
يبدو أنه يمكنك ترقية الكتابة المطبوعة إلى 3.6.4 وستعمل
بالنسبة إلى Angular 9:
يدعم هذا الإصدار فقط الإصدار 3.7 وما فوق ، لذلك لا توجد مشكلة هنا.
واسمحوا لي أن أعرف إذا كنت مخطئا بأي شكل من الأشكال.
tjoskar
في ٢٨ مارس ٢٠٢٠
@ Denis-Evseev ، هل يمكنك محاولة الرجوع إلى إصدار سابق من هذا lib إلى الإصدار
7.0.1(عن طريق ضبط التعديل فقط:- "ng-lazyload-image": "^7.1.0", + "ng-lazyload-image": "7.0.1",وتشغيل
npm installمرة أخرى؟)أريد فقط معرفة ما إذا كانت هذه المشكلة قد تم تقديمها في أحدث إصدار أم أنها كانت في إصدار سابق
شكرا لك.
إنه يعمل بالنسبة لي!
JUNWOO45
في ١١ مايو ٢٠٢٠
تبين أنه عندما قمت بإرجاع إصدار سابق من 7.1.0 إلى 7.0.1 ، فإنه يعمل بالفعل ، ولكن بعد ذلك لم أتمكن من استخدام حدث OnStateChange حيث يبدو أن هذه الوظيفة أتت بالفعل في الإصدار 7.1.0. كان علي أن ينتج عن استخدام onLoad الذي يقوم فقط بإرجاع قيمة منطقية.
تمامًا كما ذكر @ Denis-Evseev ، تحتاج إلى التغيير مباشرةً إلى "7.0.1" وحذف أيضًا المرجع إلى "7.1.0" من ملف package.lock حتى يتمكن من إجراء تثبيت جديد لـ "7.0.1". إصدار 1 ". بالإضافة إلى ذلك ، يمكنك حذف مجلد "ng-lazy-load-image" من دليل node_modules
teedon
في ١٢ مايو ٢٠٢٠
لم يعد Angular 7 مدعومًا من قبل فريق Angular وبالتالي فهو غير مدعوم من قبل ng-lazyload-image أيضًا. ومع ذلك ، يسعدني قبول العلاقات العامة أو الاقتراحات حول كيفية إصلاح ذلك.
إذا كان لدى شخص ما مشكلة مماثلة في Angular 8 أو 9 ، فيرجى إنشاء إصدار جديد.
tjoskar
في ٢٩ مايو ٢٠٢٠
القضايا ذات الصلة
el-davo
·
4تعليقات
MonchiLin
·
3تعليقات
rimlin
·
5تعليقات
myrsk
·
6تعليقات
dkmostafa
·
7تعليقات
التعليق الأكثر فائدة
@ Denis-Evseev ، هل يمكنك محاولة الرجوع إلى إصدار سابق من هذا lib إلى الإصدار
7.0.1(عن طريق ضبط التعديل فقط:وتشغيل
npm installمرة أخرى؟)أريد فقط معرفة ما إذا كانت هذه المشكلة قد تم تقديمها في أحدث إصدار أم أنها كانت في إصدار سابق