Storybook: Storybook 5.0.0 موضوع العاطفة وخطأ محمل التفاعل

@ afrankel-sfdo هل يمكنك إزالة node_modules و yarn.lock وحاول مرة أخرى؟ لقد رأينا الكثير من الغرابة حول أشياء مثل هذه ، على سبيل المثال https://github.com/storybooks/frontpage/pull/28#issuecomment -468666553

shilman حتى على info @storybook/react v5.0.0-rc.10 :

rm yarn.lock; rm -Rf node_modules/; yarn; yarn storybook

Error: Cannot find module 'emotion-theming/package.json'

هذا غريب حقًا. هل يمكنك تقديم ريبرو؟ لا أرى ذلك في تطبيق اختبار CRA الخاص بي أو في تطبيق اختبار Gatsby الخاص بي

لدي نفس الشيء مع @storybook/[email protected]

تحرير: المرة الثالثة حذف package-lock.json & node_modules هو الحيلة بالنسبة لي

لديك نفس المشكلة هنا في @ storybook / رد فعل @
ومع ذلك ، فإن إزالة ملف yarn.lock ليس خيارًا في عمليتنا

نفس المشكلة على 5.0.0 ولاحظت أيضًا انخفاضًا ...

ModuleParseError: Module parse failed: Unexpected token (20:24)
You may need an appropriate loader to handle this file type.
|       console.info('HMR Configured');
|       module.hot.accept('layouts/App', () => {
>         ReactDOM.render(<App />, document.getElementById('root'));
|       });
|     }

    "@storybook/addon-a11y": "5.0.0",
    "@storybook/addon-actions": "5.0.0",
    "@storybook/addon-console": "^1.1.0",
    "@storybook/addon-info": "5.0.0",
    "@storybook/addon-knobs": "5.0.0",
    "@storybook/addon-links": "5.0.0",
    "@storybook/addon-notes": "5.0.0",
    "@storybook/addon-storyshots": "5.0.0",
    "@storybook/addon-viewport": "5.0.0",
    "@storybook/addons": "5.0.0",
    "@storybook/core": "5.0.0",
    "@storybook/react": "5.0.0",

يعمل تثبيت كتاب القصص الجديد بشكل جيد ، ولم يتتبع ما قد يسبب هذه المشكلات في مشروعنا.

@ afrankel-sfdo أرى نفس المشكلة. نظريتي الحالية هي أن عدم وجود @emotion/core يسبب ModuleParseError . قمت بتشغيل npm i @emotion/core @emotion/styled والذي بدا أنه حل المشكلة. بغرابة ، لاحظت أنه تمت إزالة هذين القسمين من package-lock.json ، على الرغم من عدم علمي بالسبب. لقد أزلتهم من package.json وتركت package-lock.json معهم ، وأعتقد أنني عدت للعمل ، على الرغم من أن ذلك لا يفسر حقًا ما حدث.

تحديث: لاحظت هذا عند تشغيل npm ls @emotion/core بعد الخطوات أعلاه:

[email protected] /Users/jamesdigioia/Code/compiq/web
├── @emotion/[email protected]  extraneous
└─┬ @storybook/[email protected]
  └─┬ @storybook/[email protected]
    └── @emotion/[email protected]

npm ERR! extraneous: @emotion/[email protected] /Users/jamesdigioia/Code/compiq/web/node_modules/@emotion/core

لا يتم رفع @emotion/core إلى الجذر ، حيث يتوقع الإصدار ذلك (إنه غريب لأنه لم يعد موجودًا في package.json ). يتم استدعاء require.resolve في @storybook/ui/paths.js ، لكنه مثبت فقط تحت @storybook/theming ، لذا فهو متداخل في node_modules في هذا المجلد ، مما يعني أن require.resolve في @storybook/ui لا يمكن العثور عليه.

أريد أن أقول إن الحل هو إضافة @emotion/{core,styled} كتبعية إلى @storybook/ui ، نظرًا لأن @storybook/ui يبحث عنها.

تحديث آخر: إذا كنت لا تريد حذف package-lock.json ، يبدو أن npm dedupe قد حل المشكلة بالنسبة لي.

@ FrAgFo0d هل يعمل إذا حذفت yarn.lock ؟ لست بحاجة إلى التحقق من التغيير ، ولكن سيكون من المفيد معرفة ما إذا كان هذا الحل مناسبًا لك. سنصل إلى الجزء السفلي منه في النهاية ، لكن في الوقت الحالي يبدو الأمر وكأنه خطأ في الغزل ...

لدي نفس المشكلة ولم أتمكن من حلها عن طريق حذف yarn.lock

على الرغم من ذلك ، قام yarn add @emotion/core @emotion/styled بحله على الفور

كنت أتلقى بعض الأخطاء الغريبة المتعلقة بالعاطفة. أدى حذف node_modules و yarn.lock وتشغيل yarn cache clean قبل التثبيت إلى حل المشكلة بالنسبة لي.

ربما تتعلق المشكلة بنسختين مختلفتين من المشاعر يستخدمهما كتاب القصة / الأساسي وكتاب القصص / الموضوع. كل هذا غريب جدًا ، لا يمكنني تجاوز هذا. عندما أقوم بتثبيت مكتبات المشاعر يدويًا ، فإنها تتشكل ، لكني أحصل على أخطاء في المتصفح ( Cannot read property 'Consumer' of undefined at ThemeProvider ) ولا يتم عرض أي شيء.

لقد نجحت في تطبيق CRA الأصلي ، لكن في إعداد Webpack المخصص الخاص بي لم يحدث ذلك. أحاول إعداد كتب القصص لمكتبة مكون ويب React Native Web. هنا ريبو اختباري: https://github.com/MrLoh/universal-react-storybook

أدى الرجوع إلى إصدار القصص القصيرة 4.1.13 حل المشكلة ، لذلك ربما يكون عدم التوافق في مشروعي بين كتاب القصص / رد الفعل وكتاب القصص / رد الفعل الأصلي مع إصدارات مختلفة

تضمين التغريدة

واجهت أيضًا هذه المشكلة (أستخدم @storybook/vue رغم ذلك).
ووجدت أن إحدى الحزم في package.json تعتمد على حزمة @storybook/addons القديمة التي كانت تعتمد على حزمة @emotion/* قديمة داخليًا.

كحل بديل ، كتبت حقل resolutions لهذه المكتبة ، وقد أدى ذلك إلى حل المشكلة بالنسبة لي.

  "resolutions": {
    "my-old-library/@storybook/addons":"^5.0.0"
  }

@ FrAgFo0d هل يعمل إذا حذفت yarn.lock ؟ لست بحاجة إلى التحقق من التغيير ، ولكن سيكون من المفيد معرفة ما إذا كان هذا الحل مناسبًا لك. سنصل إلى الجزء السفلي منه في النهاية ، لكن في الوقت الحالي يبدو الأمر وكأنه خطأ في الغزل ...

أتمنى أن يكون الأمر كذلك ، ولكن بعد القيام بذلك لا يمكنني القول أن المشكلة ناتجة عن عناصر أخرى يتم تثبيتها بإصدارات غير متطابقة أو عن طريق القصص القصيرة نفسها.

يمكنني تجربة yarn add @emotion/core @emotion/styled لمعرفة ما إذا كان قد تم حلها. "
ومع ذلك ، فأنا أفضل عدم إضافة المزيد من التبعيات في مشروعي الخاص ؛)

عملت لدينا لإضافة @storybook/theming كتبعية صريحة

لقد واجهت للتو نفس المشكلة على نظام التشغيل Mac OSX ، في نظام Windows ، كل شيء يعمل بشكل جيد على نظام Mac ، كان علي تشغيل npm i @emotion/core @emotion/styled لجعله يعمل

واجهت نفس المشكلة مع [email protected] ، نجح حل هومبورغ بالنسبة لي

لم تكن إزالة ملف yarn.lock خيارًا بالنسبة لي (وأنا أوصي بعدم القيام بذلك في معظم الحالات). تمكنا من إصلاحه عن طريق ..

$ rm -rf node_modules
$ yarn cache clean
$ yarn remove @storybook/core @storybook/theming [all other storybook deps]
$ yarn add -D @storybook/core @storybook/theming ....

آمل أن يساعد هذا أي شخص آخر يواجه هذه المشكلة

+1 نفسه بالنسبة لنا. الحل الوحيد في هذا الموضوع الذي نجح هو العودة إلى القصة القصيرة 4

كما أتيحت لي هذه المشكلة مع
@storybook/react: 5.0.3
ماكو موهافي
حل مع:

yarn add --dev @emotion/core -W
yarn add --dev emotion-theming -W

لقد واجهنا نفس المشكلة بعد الترقية من v5.0.3 إلى v5.0.5.

حل مع:
yarn add --dev @storybook/theming

ما زلت أتلقى هذه المشكلة. لدي أحدث ما يلي:

• @storybook/theming
• @emotion/core
• @emotion/styled

لم تنجح جميع عمليات مسح ذاكرة التخزين المؤقت. لا يزال يحاول العثور على الحزمة القديمة emotion-theming :

info => Loading presets
WARN   Failed to load preset: "/Users/areardon/code/react-beautiful-dnd/node_modules/@storybook/core/dist/server/manager/manager-preset.js"
ERR! Error: Cannot find module 'emotion-theming/package.json'

لقد قمت بتثبيت حزمة emotion-theming وكل شيء يعمل ..

تم إصلاحه تمامًا مثل emotion-theming : https://emotion.sh/docs/emotion-theming كان يتلقى الخطأ التالي:

info @storybook/react v5.0.5
info 
info => Loading presets
WARN   Failed to load preset: "/Users/Felipe/Local_Projects/monorepo/node_modules/@storybook/core/dist/server/manager/manager-preset.js"
ERR! Error: Cannot find module 'emotion-theming/package.json'

أريد أن أقول إن الحل هو إضافة @ emotion / {core، styled} كتبعية لـ @ storybook / ui ، نظرًا لأن @ storybook / ui يبحث عنها.

أتفق مع mAAdhaTTah على أن هذا سيكون الحل الصحيح. من الخطأ أن نأمل أن يقوم مدير الحزم برفع التبعية.

توجد نفس المشكلة مع @ storybook / رد فعل v5.0.6 أيضًا.

فشل تحميل الإعداد المسبق: "/Users/vinkumar2/Documents/Projects/PatternLibs/ReactPatternLib/node_modules/@storybook/core/dist/server/manager/manager-preset.js"
خطأ! خطأ: لا يمكن العثور على الوحدة النمطية "@ emotion / core / package.json"

ساعدت إضافة @ emotion / core في DevDependencies ويعمل Storybook. يبدو أنه مفقود في تبعيات الحزمة مع @ storybook / رد فعل.

لقد وضعت العلاقات العامة لهذا هنا: # 6435

اجادس !! لقد أصدرت للتو https://github.com/storybooks/storybook/releases/tag/v5.1.0-alpha.23 الذي يحتوي على PR # 6435 الذي يشير إلى هذه المشكلة. قم بالترقية اليوم لتجربتها!

نظرًا لأنه إصدار تجريبي ، يمكنك العثور عليه على علامة @next NPM.

إغلاق هذه القضية. الرجاء إعادة الفتح إذا كنت تعتقد أنه لا يزال هناك المزيد لتفعله.

أصلح إصدار Alpha المشكلة بالنسبة لي ، شكرًا shilman !

لا تزال المشكلة قائمة في 5.0.10 (من خلال سجلات npm ، يكون إصدارًا بعد alpha.23)

رسالة خطأ:

فشل تحميل الإعداد المسبق: "/.../node_modules/@storybook/core/dist/server/manager/manager-preset.js"
خطأ! خطأ: لا يمكن العثور على الوحدة النمطية "emotion-theming / package.json"

تتبع المكدس:

stack: 'Error: Cannot find module \'emotion-theming/package.json\'\n    
at Function.Module._resolveFilename (module.js:536:15)\n    
at Function.resolve (internal/module.js:18:19)\n   
at Object.<anonymous> (/.../node_modules/@storybook/ui/paths.js:16:38)\n    
at Module._compile (module.js:635:30)\n    
at Object.Module._extensions..js (module.js:646:10)\n    
at Module.load (module.js:554:32)\n    
at tryModuleLoad (module.js:497:12)\n    
at Function.Module._load (module.js:489:3)\n    
at Module.require (module.js:579:17)\n    
at require (internal/module.js:11:18)\n    
at Object.<anonymous> (/.../node_modules/@storybook/core/dist/server/manager/manager-webpack.config.js:18:37)\n    
at Module._compile (module.js:635:30)\n    
at Object.Module._extensions..js (module.js:646:10)\n    
at Module.load (module.js:554:32)\n    
at tryModuleLoad (module.js:497:12)\n    
at Function.Module._load (module.js:489:3)',

Stralos هذا الإصلاح موجود في فرع إصدار 5.1.X ، والذي لا يزال حاليًا في ألفا ( 5.1.0-alpha.33 ).

BrendanAnnablealexlafrosciadevrelm يجب أن التصحيح الظهر الإصلاح إلى 5.0.x ؟

shilman لست متأكدًا من جدول إصدار القصص القصيرة (على سبيل المثال لـ 5.1.x) ، ولكن هذا يمنع عددًا من المشاريع التي تقوم بالترقية إلى Storybook 5 ، لذلك أحب أن يصل هذا الإصلاح إلى إصدار غير ألفا إن أمكن 🙂

المشكلة هنا هي أن الغزل (أو npm) غريب (في هذه الحالة ، ليس) يرفع الحزم. مخرجات yarn list أو yarn why معيبة أيضًا:

% yarn why emotion-theming
yarn why v1.15.2
[1/4] 🤔  Why do we have the module "emotion-theming"...?
[2/4] 🚚  Initialising dependency graph...
[3/4] 🔍  Finding dependency...
[4/4] 🚡  Calculating file sizes...
=> Found "[email protected]"
info Reasons this module exists
   - "_project_#some_project#@storybook#addon-actions#@storybook#theming" depends on it
   - Hoisted from "_project_#some_project#@storybook#addon-actions#@storybook#theming#emotion-theming"
✨  Done in 1.74s.

% yarn list emotion-theming
yarn list v1.15.2
warning Filtering by arguments is deprecated. Please use the pattern option instead.
└─ [email protected]
✨  Done in 1.86s.

% find . -type d -name emotion-theming
./some_project/node_modules/@storybook/addon-actions/node_modules/emotion-theming
./some_project/node_modules/@storybook/theming/node_modules/emotion-theming
./node_modules/@storybook/ui/node_modules/emotion-theming
./node_modules/@storybook/router/node_modules/emotion-theming

كما ترى ، فإن الغزل يبلغ عن وجود حزمة واحدة فقط emotion-theming ، والتي يجب رفعها إلى الجذر ، لكن الأمر ليس كذلك: إنها تكرار الحزمة في 4 أماكن عبر حزم مختلفة. سواء كان خطأ في الغزل / npm ، لست متأكدًا. ربما تسبب تركيبة التبعيات ' dependencies و peerDependencies هذا السلوك الغريب؟ فشل إعداد كتاب القصص الخاص بي عندما يكون لدي إصدارات رئيسية مختلفة من حزم القصص القصيرة ، على سبيل المثال @storybook/[email protected] و @storybook/[email protected] جنبًا إلى جنب.

أعتقد أيضًا أن مجموعتنا من وجود مساحة عمل من خيوط monorepo و nohoisting عالية المستوى يمكن أن تكون أيضًا عوامل في التسبب في هذه المشكلة:

"workspaces": { "nohoist": [ "some_project/*", "some_project/@*/*", ], "packages": [ "some_project", ] },

أواجه أيضًا نفس المشكلات ولكن يبدو أن معظم الحلول المذكورة أعلاه لم تحل المشكلة بالنسبة لي.
لقد جربت أيضًا إصدار ألفا وما زلت أتلقى الخطأ.
لا تزال المشكلة بالنسبة لي أن حزمتين مختلفتين تبحثان عن نسختين مختلفتين من @emotion/core لذا يعمل التثبيت اليدوي ولكن هناك دائمًا واحدة من الحزمتين اللتين تشتكي من الإصدار المفقود.

/[email protected] /repos/ui
├─┬ @storybook/[email protected]
│ └─┬ @storybook/[email protected]
│   └── @emotion/[email protected]  deduped
├─┬ @storybook/[email protected]
│ └── @emotion/[email protected]
└─┬ @storybook/[email protected]
  └─┬ @storybook/[email protected]
    └─┬ @storybook/[email protected]
      └── UNMET PEER DEPENDENCY @emotion/[email protected]

npm ERR! peer dep missing: @emotion/core@^10.0.0, required by [email protected]

أحاول أيضًا إضافة npm i @storybook/theming يدويًا ولكن لم يحالفني الحظ.

devrelm يجب أن يعمل الإصلاح الخاص بك (# 6435) حتى مع npm ، وليس فقط الغزل .. صحيح؟

@ whyayala التي عملت معي ، شكرًا!

تمت الترقية إلى 5.x ، وواجهت الخطأ وقمت للتو بالتحديث إلى 5.1.9 بنفس المشكلة تمامًا.

ومع ذلك ، لا أحصل إلا على نسخة واحدة من @ emotion / core (10.0.10)

alasdairhurst لقد ركضت أيضًا في هذه المشكلة.

يمكنك رؤيته في هذا المشروع التجريبي مع CRA
https://github.com/marco-silva0000/cra-test-pnp-storybook

عملت لدينا لإضافة @storybook/theming كتبعية صريحة

هل فهمت يوما لماذا ساعدت؟ لأنه ساعدنا أيضًا ، وهو أمر رائع! لكني لا أفهم لماذا: ص

إذا كان هذا قد يساعد أي شخص - لقد تلقيت هذا الخطأ أيضًا ، واستغرق الأمر بعض الوقت لأدرك أنني كنت أقوم بتثبيت الحزمة خارج مجلد موقع الويب ... لهذا السبب لم يتم العثور على الحزمة json ...