首页 > 解决方案 > React Native Jest - BABEL 参考错误

问题描述

我正在为 Uni 的一个项目开发一个修订应用程序,并且我几乎完成了所有代码,但是现在是测试的时候了,我在为我的 React Native 项目设置测试环境时遇到了一些麻烦。无论我尝试什么,我都会不断收到此错误。我很确定我已经搞砸了一些依赖项的配置,但是几天来一直试图让它工作,只是觉得我需要第二个意见和一组新的眼睛。

这是我不断收到的错误消息;

● Test suite failed to run

    ReferenceError: [BABEL] C:\Users\Owner\Dropbox\Discrete Math Tutor App for FC2\Revision App\FC2 Revision App\src\tests\Main.test.js: Unknown option: base.configFile. Check out http://babeljs.io/docs/usage/options/ for more information about options.

    A common cause of this error is the presence of a configuration options object without the corresponding preset name. Example:

    Invalid:
      `{ presets: [{option: value}] }`
    Valid:
      `{ presets: [['presetName', {option: value}]] }`

    For more detailed information on preset configuration, please see https://babeljs.io/docs/en/plugins#pluginpresets-options.

      at Logger.error (node_modules/babel-core/lib/transformation/file/logger.js:41:11)
      at OptionManager.mergeOptions (node_modules/babel-core/lib/transformation/file/options/option-manager.js:226:20)
      at OptionManager.init (node_modules/babel-core/lib/transformation/file/options/option-manager.js:368:12)
      at File.initOptions (node_modules/babel-core/lib/transformation/file/index.js:212:65)
      at new File (node_modules/babel-core/lib/transformation/file/index.js:135:24)
      at Pipeline.transform (node_modules/babel-core/lib/transformation/pipeline.js:46:16)

这是我的 package.json 文件;

{
  "name": "empty-project-template",
  "main": "node_modules/expo/AppEntry.js",
  "private": true,
  "scripts": {
    "start": "node node_modules/react-native/local-cli/cli.js start",
    "android": "expo start --android",
    "ios": "expo start --ios",
    "eject": "expo eject",
    "build": "(cd android/ && ./gradlew assembleDebug)",
    "bundle-android": "react-native bundle --platform android --dev false --entry-file index.android.js --bundle-output android/app/src/main/assets/index.android.bundle --sourcemap-output android/app/src/main/assets/index.android.map --assets-dest android/app/src/main/res/",
    "test": "react-scripts test"
  },
  "dependencies": {
    "@expo/vector-icons": "^9.0.0",
    "adb": "^0.2.0",
    "axios": "^0.18.0",
    "babel-jest": "23.6.0",
    "babel-preset-env": "^1.7.0",
    "expo": "^32.0.1",
    "firebase": "^5.5.8",
    "native-base": "^2.8.1",
    "npm": "^6.9.0",
    "react": "16.5.0",
    "react-addons-update": "^15.6.2",
    "react-dom": "^16.8.4",
    "react-lineto": "^3.1.3",
    "react-mindmap": "^2.1.6",
    "react-native": "https://github.com/expo/react-native/archive/sdk-31.0.0.tar.gz",
    "react-native-alarm": "^1.2.0",
    "react-native-android-fullscreen-webview-video": "^1.0.3",
    "react-native-animatable": "^1.3.1",
    "react-native-calendar-events": "^1.6.4",
    "react-native-calendar-reminders": "^1.1.2",
    "react-native-chart-kit": "^2.2.1",
    "react-native-charts": "^3.0.0",
    "react-native-dash": "^0.0.9",
    "react-native-deprecated-custom-components": "^0.1.2",
    "react-native-div": "^1.1.2",
    "react-native-dropdown": "^0.0.6",
    "react-native-elements": "^0.19.1",
    "react-native-firebase": "^5.2.1",
    "react-native-flexi-radio-button": "^0.2.2",
    "react-native-onesignal": "^3.2.12",
    "react-native-picker-dropdown": "^0.1.2",
    "react-native-prompt-android": "^0.3.4",
    "react-native-push-notification": "^3.1.2",
    "react-native-sound": "^0.10.9",
    "react-native-svg-charts": "^5.2.0",
    "react-native-system-notification": "^0.2.1",
    "react-native-video": "^4.3.1",
    "react-navigation": "^2.18.2",
    "react-router-dom": "^4.3.1",
    "react-router-native": "^4.3.0",
    "react-scripts": "^2.1.8",
    "react-test-renderer": "^16.8.3",
    "react-transition-group": "^2.5.3",
    "test": "^0.6.0"
  },
  "devDependencies": {
    "babel-preset-expo": "^5.0.0"
  },
  "transformIgnorePatterns": [
    "node_modules/(?!(react-native|my-project|react-native-button)/)"
  ]
}

这是我的 babel.config.js 文件;

module.exports = function(api) {
  api.cache(true);
  return {
    presets: ['babel-preset-expo'],
  };
};

这是测试文件;

import React from 'react';
import 'react-native';
import { Main } from '../screens/Main.js';
import { shallow, mount, enzyme, configure } from 'enzyme';

const Adapter = require("enzyme-adapter-react-16");

enzyme.configure({ adapter: new Adapter() });

test('Search snapshot test', () => {
	const component = shallow(<Main />);
	expect(component.change(10)).toBe(100);
});

我将不胜感激任何帮助/建设性的批评(因为我确信我的编码实践不是最好的)!:)

标签: javascriptreact-nativebabeljs

解决方案


推荐阅读