Jest: SyntaxError: لا يمكن استخدام عبارة الاستيراد خارج وحدة نمطية

تم إنشاؤها على ١١ يناير ٢٠٢٠  ·  19تعليقات  ·  مصدر: facebook/jest

عند استخدام وحدات ECMAScript في Node (الإصدار 13.6.0 بالنسبة لي) مع Jest ، يحدث الخطأ التالي:

SyntaxError: Cannot use import statement outside a module

      at ScriptTransformer._transformAndBuildScript (node_modules/@jest/transform/build/ScriptTransformer.js:537:17)
      at ScriptTransformer.transform (node_modules/@jest/transform/build/ScriptTransformer.js:579:25)

هذا هو رمز الاختبار الذي أحاول تنفيذه.

import { checks } from '../../../../src/utils/index.js'

describe('Array type check', () => {
    test('to return false when not an array', () => {
        expect(checks.array('string')).toEqual(false)
    })
})

أظن أن المشكلة هي أن Jest لم يتم تكوينه لتشغيل كود Node باستخدام "type: module" (وحدات ECMAScript).

Bug Report Needs Repro Needs Triage

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

مجموعة الخطوات الأكثر اكتمالا هي:

  1. npm i --save-dev jest babel-jest @babel/preset-env
  2. أضف المتابعة إلى module.exports في jest.config.js
transform: {
    "^.+\\.jsx?$": "babel-jest"
  },
  1. قم بإنشاء ملف babel.config.json باستخدام ما يلي
{
  "presets": ["@babel/preset-env"]
}

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

ال 19 كومينتر

لقد قمت بحل المشكلة عن طريق القيام بما يلي:

yarn add ts-jest -D

ثم في ملف jest.config.js ضع التالي:

module.exports = {
  transform: {
    '^.+\\.ts?$': 'ts-jest',
  },
};

صحيح ، ESM غير مدعوم. يمكنك تتبع # 4842. في هذه الأثناء ، تحتاج إلى تحويلها إلى cjs (باستخدام babel ، و typecript ، إلخ)

مجموعة الخطوات الأكثر اكتمالا هي:

  1. npm i --save-dev jest babel-jest @babel/preset-env
  2. أضف المتابعة إلى module.exports في jest.config.js
transform: {
    "^.+\\.jsx?$": "babel-jest"
  },
  1. قم بإنشاء ملف babel.config.json باستخدام ما يلي
{
  "presets": ["@babel/preset-env"]
}

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

واجهت نفس المشكلة عندما بدأت في استخدام babel ... ولكن لاحقًا ، كان لدي حل ... لم تعد لدي المشكلة بعد الآن ... حاليًا ، Node v12.14.1، "@ babel / node" : "^ 7.8.4" ، أستخدم عقدة babel و nodemon للتنفيذ (العقدة جيدة أيضًا ..)

package.json:
"بدء": "nodemon --exec babel-node server.js" debug ":" babel-node debug server.js "!! ملاحظة: server.js هو ملف الإدخال الخاص بي ، يمكنك استخدام ملفك.

launch.json:
عند تصحيح الأخطاء ، تحتاج أيضًا إلى تكوين ملف launch.json الخاص بك "runtimeExecutable": "$ {workspaceRoot} /node_modules/.bin/babel-node" !! ملاحظة: بالإضافة إلى runtimeExecutable في التكوين.

بالطبع ، مع babel-node ، تحتاج عادةً أيضًا إلى ملف آخر وتحريره ، مثل ملف babel.config.js / .babelrc

{
"الإعدادات المسبقة": ["@ babel / preset-env"]
}

حل رائع !!

لمعلوماتك بالنسبة لبعض الأشخاص ، إذا كنت تستخدم ملف .babelrc ، فلن تعمل التغييرات بالنسبة لي. اضطررت إلى حذف .babelrc الخاص بي واستخدام ملف babel.config.json المقترح

لقد نجح حل نجاحه بالضبط ، لأن TBH ليس لدي أي فكرة عما تفعله هذه الخطوات بالفعل (ولكن شكرًا لك smpeters على نشرها!)

  1. يحتوي Jest على خيار تحويل يأخذ كائنًا حيث تكون المفاتيح عبارة عن تعبيرات عادية لأسماء الملفات لتتطابق مع قيمها وكيفية تحويلها.
  2. يدعو Jest هذه القيم "مسار إلى المحول". ليس لدي أي فكرة عما يعنيه هذا بالضبط ، ولكن أفضل تخمين لدي هو أنه نظرًا لأنه كان علينا تثبيت الوحدة babel-jest ، فإن "babel-jest" هو مسار لتلك الوحدة. لذا أعتقد أنه إذا كانت الوحدة تسمى babel-jest-hooray فإن "مسار المحول" سيكون السلسلة "babel-jest-hooray" .
  3. إذن ما هي الوحدة النمطية babel-jest ؟ يبدو أنه موجود لاستخدام Babel لتحويل ملفات jest ، أي لحل هذه المشكلة بالضبط. إذا كان افتراضي أعلاه صحيحًا ، فهذا ما هو عليه: https://github.com/facebook/jest/blob/master/packages/babel-jest/src/index.ts#L163
  4. حسنا جيد. إذن ما هو بابل؟ إنه مترجم JavaScript (ولكن كذلك Webpack؟ لا أعلم ، دعنا نذهب معه). يقوم بالعمل. babel-jest عبارة عن مادة لاصقة بين Babel - التي لا تعرف شيئًا عن Jest - و Jest.
  5. لجعل العمل بابل تحتاج إلى تكوينه. يأتي مع إعدادات مسبقة ، لكنها ليست معدة مسبقًا بالفعل. عليك ضبطهم. وبالتالي يتم تثبيت الوحدة النمطية @babel/preset-env .
  6. ما هي الوحدة النمطية @babel/preset-env ؟ إنه "إعداد مسبق ذكي يسمح لك باستخدام أحدث إصدار من JavaScript دون الحاجة إلى إدارة دقيقة لأي تحولات في بناء الجملة" ، مما يعني أنه يحدد جميع الإعدادات الافتراضية التي تريد القيام بها بشكل عادي وغير مفاجئ. لطيف!
  7. فكيف يعرف بابل كيفية استخدام هذا؟ عليك أن تخبره عن طريق إنشاء ملف التكوين بابل. هذا هو المكان الذي يأتي فيه خيار التكوين "preset" .

يا للعجب!

smpeters أحصل على ReferenceError: regeneratorRuntime is not defined وهو يشير إلى وظيفة انتظار غير متزامنة باعتبارها الجاني.

أي أفكار حول هذا؟

changyeamoon أعتقد أن هذا لأن @babel/preset-env ليس له هدف واضح ويستهدف افتراضيًا جميع متصفحات الويب ، في محاولة لتحويل كل التعليمات البرمجية في هذه العملية.

في حالة استخدام Node ، يجب أن يبدو babel.config.json بالشكل التالي:

{
  "presets": [
    [
      "@babel/preset-env",
      {
        "targets": {
          "node": true
        }
      }
    ]
  ]
}

المصدر: https://babeljs.io/docs/en/babel-preset-env#targets

لقد قمت بحل المشكلة عن طريق ترحيل ملف .babelrc إلى babel.config.js ! المفزع.

لقد قمت بحل المشكلة عن طريق ترحيل ملف .babelrc إلى babel.config.js ! المفزع.

كيف فعلت الهجرة؟

حسنًا ، لقد قضيت يومًا كاملاً في محاولة اكتشاف ... اتضح لي أنني أعدت استخدام ملف .js من مشروع آخر تم تعيينه لتجميع كل شيء. لم يفعل المشروع الجديد ذلك وكان ملف .js هذا يقوم بتصدير ESM. لذلك قمت بتغيير الاسم إلى .ts and bang zoom! من المحتمل أن تكون هناك طريقة لتضمين .js في المجموعة بحيث يتم تحويلها إلى ESM ولكن نظرًا لأنني أقوم بتحويل كل شيء إلى TS على أي حال لم أزعجني. من فضلك لا تتردد في إعلامي حتى إذا اكتشفت ذلك.

مع الإصدار الحالي من ts-jest ، لم أكن بحاجة إلى أدوات babel. ts-jest 25.5.1 ونسخة مطبوعة 3.9.3.

هذا هو jest.config.js الخاص بي

module.exports = {
  preset: 'ts-jest',
  coverageDirectory: 'coverage',
  collectCoverageFrom: ['src/**/*.{ts,tsx,js,jsx}', '!src/**/*.d.ts'],
};

عزيزي smpeters
لدي نفس المشكلة في رد الفعل الأصلي. لك الحل لم ينجح

لقد قمت بحلها لمشروع React Native الخاص بي. أولاً ، قمت بتهيئة قالب TypeScript جديد باستخدام npx react-native init وقارنت ملفات tsconfig.json. فاتني الإعدادات التالية:

"module": "commonjs",
"lib": ["ES6"],
"isolatedModules": true,
"strict": true,
"noEmit": true,

ثم قمت بتكوين transformIgnorePatterns لملفاتي es.
https://github.com/nrwl/nx/issues/812

في حالتي ، كانت هناك مشكلة في تحميل lodash ، لذلك قمت بحلها بالسخرية من الوظائف التي أحتاجها لاستخدامها ، مثل lodash-es/round ، لذلك ضمن المجلد __mocks__ ، أضفت للتو مجلد آخر به lodash-es وملف round.js بشيء مثل module.exports = jest.fn(numb => numb);

هذا ما فعل الحيلة. آمل أن يساعد شخص آخر.

لقد قمت بحل المشكلة عن طريق ترحيل ملف .babelrc إلى babel.config.js ! المفزع.

لقد ساعدني هذا حقًا ، لقد صدمت أيضًا :)

لقد صادفت هذه المشكلة وأردت ترك حل يعمل في حالتي. نحن نستخدم بعض المكتبات المطورة داخليًا والتي نستخدمها في تطبيقاتنا. نظرًا لأن المكتبات يتم تسليمها فقط كوحدات ES6 النمطية ، لذا فإن محاولة اختبارها أدت إلى ظهور خطأ من عنوان المشكلة. ما كان علي فعله لإصلاحه هو:

  • قم بتغيير .babelrc إلى babel.config.json
  • ترحيل ضبط Jest من package.json إلى jest.config.js
  • أضف هذا السطر إلى ملف تهيئة Jest:
transformIgnorePatterns: ['node_modules/(?!@foobar)/']

حيث foobar هو اسم المكتبة التي نستخدمها. من خلال فهمي أن هذا يسمح بابل لتحويل وحدات ES6 بشكل صحيح لـ Jest. وتخلصت من الخطأ.

يعمل الحل الخاص بي مع ملفات React JSX. والآخر لملفات Typescript.
إنها حلول مماثلة لمشاكل مماثلة.

يوم الأحد 30 آب (أغسطس) 2020 الساعة 6:05 صباحًا ، داني هينشاو ، إخطارات github.com
كتب:

أنا هنا للتو أحاول معرفة سببziishaned
https://github.com/ziishaned يتم التصويت على إجابة إلى النسيان عند ذلك
يعمل لدي:
[الصورة: لقطة شاشة 2020-08-30 الساعة 7 02 40 صباحًا]
https://user-images.githubusercontent.com/24684771/91657446-f4b54f00-ea8e-11ea-8b10-fbd90c2de9ec.png

وفي الوقت نفسه ، يبدو أن حل smpeters https://github.com/smpeters كذلك
مقبول على نطاق واسع ولا يناسبني ...:
[الصورة: لقطة شاشة 2020-08-30 الساعة 7 04 51 صباحًا]
https://user-images.githubusercontent.com/24684771/91657475-1e6e7600-ea8f-11ea-95f1-1e0312b8bdf8.png

-
أنت تتلقى هذا لأنه تم ذكرك.
قم بالرد على هذا البريد الإلكتروني مباشرة ، وقم بعرضه على GitHub
https://github.com/facebook/jest/issues/9395#issuecomment-683406678 ، أو
إلغاء الاشتراك
https://github.com/notifications/unsubscribe-auth/AAAJQUTAG2GFPTYSA2ZXJGTSDIW63ANCNFSM4KFPEIEQ
.

للقادم الجديد ، استخدم هذا

jest.config.js

module.exports = {
  preset: 'ts-jest/presets/js-with-babel'
};

@ abrcdf1023 شكرا لك.

هل كانت هذه الصفحة مفيدة؟
0 / 5 - 0 التقييمات