Блог

Описание среды:

Я должен создать компонент react-native и опубликовать его в npm. В моем процессе я должен запланировать выполнение модульных тестов, но после многих попыток я не могу настроить jest для своего проекта.

Смотрите ниже мой package.json .Там нет зависимостей, а только devDependencies и peerDependencies:

     "scripts": {
        "test": "jest",
        "test-cov": "jest --coverage=true",
    },
    "peerDependencies": {
        "react": "^16.13.0",
        "react-native": "^0.63.0"
    },
    "devDependencies": {
        "eslint": "^7.6.0",
        "eslint-config-airbnb-base": "^14.2.0",
        "eslint-config-prettier": "^6.11.0",
        "eslint-plugin-import": "^2.22.0",
        "eslint-plugin-jest": "^23.20.0",
        "eslint-plugin-prettier": "^3.1.4",
        "prettier": "^2.0.5",
        "react": "16.13.1",
        "react-native": "^0.63.1",
        "@babel/core": "^7.11.4",
        "@babel/runtime": "^7.11.2",
        "babel-jest": "^26.3.0",
        "jest": "^26.4.2",
        "metro-react-native-babel-preset": "^0.63.0"
    },
    "jest": {
        "preset": "react-native"
    },
  

У меня также есть .babelrc файл с этим содержимым:

 {
    "presets": ["module:metro-react-native-babel-preset"]
}
  

В моей src/ папке я использую es6 синтаксис для импорта других моих файлов или подобных компонентов react-native:

 import { Dimensions } from 'react-native';

import { colors } from './colors';
  

Проблема:

Когда я запускаю команду npm run test , у меня всегда возникает эта ошибка:

  FAIL  __tests__/index.test.js
  ● Test suite failed to run

    SyntaxError: C:Usersfloridevphf_componentsphf-native-stylenode_modulesreact-nativeLibrariespolyfillserror-guard.js: Unexpected token, expected ";" (14:5)

      12 | let _inGuard = 0;
      13 | 
    > 14 | type ErrorHandler = (error: mixed, isFatal: boolean) => void;
         |      ^
      15 | type Fn<Args, Return> = (...Args) => Return;
      16 | 
      17 | /**

      at Parser._raise (node_modules/@babel/parser/lib/index.js:766:17)
      at Parser.raiseWithData (node_modules/@babel/parser/lib/index.js:759:17)
      at Parser.raise (node_modules/@babel/parser/lib/index.js:753:17)
      at Parser.unexpected (node_modules/@babel/parser/lib/index.js:8966:16)
      at Parser.semicolon (node_modules/@babel/parser/lib/index.js:8948:40)
      at Parser.parseExpressionStatement (node_modules/@babel/parser/lib/index.js:11970:10)
      at Parser.parseStatementContent (node_modules/@babel/parser/lib/index.js:11566:19)
      at Parser.parseStatement (node_modules/@babel/parser/lib/index.js:11430:17)
      at Parser.parseBlockOrModuleBlockBody (node_modules/@babel/parser/lib/index.js:12012:25)
      at Parser.parseBlockBody (node_modules/@babel/parser/lib/index.js:11998:10)

Test Suites: 1 failed, 1 total
Tests:       0 total
Snapshots:   0 total
Time:        0.504 s
Ran all test suites.
npm ERR! code ELIFECYCLE
npm ERR! errno 1
npm ERR! phf-native-style@1.0.3 test: `jest`
npm ERR! Exit status 1
npm ERR!
npm ERR! Failed at the phf-native-style@1.0.3 test script.
npm ERR! This is probably not a problem with npm. There is likely additional logging output above.

npm ERR! A complete log of this run can be found in:
npm ERR!     C:UsersfloriAppDataRoamingnpm-cache_logs2020-08-24T09_00_35_268Z-debug.log
  

У вас есть идея, как мне помочь, пожалуйста? Спасибо

РЕДАКТИРОВАТЬ 1:

Я решаю свою проблему, конвертируя мою конфигурацию jest в json в файл js jest.config.js с нижеприведенным содержимым:

 module.exports = {
  preset: 'react-native',
  transform: {
    '^. \.js$': require.resolve('react-native/jest/preprocessor.js'),
  },
};