babel transform似乎在我的测试用例代码中起作用,但node_modules中的es6语法不起作用.

错误

img

环境

npm 4.5

马科斯塞拉wine 店

Jest

{
  "preset": "react-native",
  "globals": {
    "__DEV__": true
  },
  "transform": {
    "^.+\\.js$": "babel-jest"
  }
}

巴别塔

{
  "env": {
    "test": {
      "presets": ["react-native"],
      "plugins": [["import", { "libraryName": "antd-mobile" }]]
    },
    "development": {
      "presets": ["react-native"],
      "plugins": [["import", { "libraryName": "antd-mobile" }]]
    },
    "production": {
    }
  }
}

测试用例

import 'react-native';
import React from 'react';
import renderer from 'react-test-renderer';
import Index from '../index.ios.js';

it('renders correctly', () => {
  const tree = renderer.create(
    <Index />
  );
});

包裹json

{
  "private": true,
  "scripts": {
    "web": "roadhog server",
    "build-web": "cross-env NODE_ENV=production roadhog build",
    "start": "react-native start",
    "ios": "cross-env NODE_ENV=development node themes/theme.rn.config.js && react-native run-ios",
    "android": "cross-env NODE_ENV=development node theme/theme.rn.config.js && react-native run-android",
    "lint": "eslint --ext .js src test",
    "precommit": "npm run lint",
    "test": "cross-env NODE_ENV=test jest --config .jest.config.json --no-cache"
  },
  "engines": {
    "install-node": "6.9.2"
  },
  "theme": "./themes/theme.web.config.js",
  "dependencies": {
    "antd-mobile": "^1.0.8",
    "babel-runtime": "^6.9.2",
    "dva": "^1.2.1",
    "lodash": "^4.17.4",
    "moment": "^2.18.1",
    "rc-form": "^1.3.0",
    "react": "15.4.2",
    "react-dom": "15.4.2",
    "react-native": "0.42.3",
    "react-native-chart": "^1.0.8-beta",
    "react-native-gesture-password": "^0.2.0",
    "react-native-scrollable-tab-view": "^0.7.4",
    "react-native-smart-gesture-password": "^2.1.0",
    "react-navigation": "^1.0.0-beta.7",
    "recharts": "^0.21.2",
    "socket.io-client": "^1.7.3"
  },
  "devDependencies": {
    "babel-eslint": "^7.1.1",
    "babel-jest": "^19.0.0",
    "babel-plugin-dva-hmr": "^0.3.2",
    "babel-plugin-import": "^1.1.1",
    "babel-plugin-transform-runtime": "^6.9.0",
    "babel-preset-react-native": "^1.9.1",
    "cross-env": "^4.0.0",
    "eslint": "^3.12.2",
    "eslint-config-airbnb": "^13.0.0",
    "eslint-plugin-import": "^2.2.0",
    "eslint-plugin-jsx-a11y": "^2.2.3",
    "eslint-plugin-react": "^6.8.0",
    "expect": "^1.20.2",
    "husky": "^0.13.3",
    "jest": "^19.0.2",
    "less-vars-to-js": "^1.1.2",
    "postcss-pxtorem": "^4.0.0",
    "react-test-renderer": "15.4.2",
    "redbox-react": "^1.3.2",
    "roadhog": "^0.6.0-beta1"
  }
}

调试消息

jest version = 19.0.2
test framework = jasmine2
config = {
  "automock": false,
  "bail": false,
  "browser": false,
  "cacheDirectory": "/var/folders/h3/bfmnzb_j3zg3pdffgps1w3vh0000gn/T/jest",
  "clearMocks": false,
  "coveragePathIgnorePatterns": [
    "/node_modules/"
  ],
  "coverageReporters": [
    "json",
    "text",
    "lcov",
    "clover"
  ],
  "expand": false,
  "globals": {
    "__DEV__": true
  },
  "haste": {
    "defaultPlatform": "ios",
    "platforms": [
      "android",
      "ios",
      "native"
    ],
    "providesModuleNodeModules": [
      "react-native"
    ]
  },
  "moduleDirectories": [
    "node_modules"
  ],
  "moduleFileExtensions": [
    "js",
    "json",
    "jsx",
    "node"
  ],
  "moduleNameMapper": [
    [
      "^[./a-zA-Z0-9$_-]+\\.(bmp|gif|jpg|jpeg|png|psd|svg|webp)$",
      "RelativeImageStub"
    ],
    [
      "^React$",
      "/Users/erickim/Documents/Develop/react/glfm/node_modules/react"
    ]
  ],
  "modulePathIgnorePatterns": [
    "/Users/erickim/Documents/Develop/react/glfm/node_modules/react-native/Libraries/react-native/",
    "/Users/erickim/Documents/Develop/react/glfm/node_modules/react-native/packager/"
  ],
  "noStackTrace": false,
  "notify": false,
  "preset": "react-native",
  "resetMocks": false,
  "resetModules": false,
  "roots": [
    "/Users/erickim/Documents/Develop/react/glfm"
  ],
  "snapshotSerializers": [],
  "testEnvironment": "/Users/erickim/Documents/Develop/react/glfm/node_modules/jest-环境-node/build/index.js",
  "testMatch": [
    "**/__tests__/**/*.js?(x)",
    "**/?(*.)(spec|test).js?(x)"
  ],
  "testPathIgnorePatterns": [
    "/node_modules/"
  ],
  "testRegex": "",
  "testResultsProcessor": null,
  "testURL": "about:blank",
  "timers": "real",
  "transformIgnorePatterns": [
    "node_modules/(?!(jest-)?react-native|react-clone-referenced-element)"
  ],
  "useStderr": false,
  "verbose": null,
  "watch": false,
  "setupFiles": [
    "/Users/erickim/Documents/Develop/react/glfm/node_modules/babel-polyfill/lib/index.js",
    "/Users/erickim/Documents/Develop/react/glfm/node_modules/react-native/jest/setup.js"
  ],
  "transform": [
    [
      "^.+\\.js$",
      "/Users/erickim/Documents/Develop/react/glfm/node_modules/babel-jest/build/index.js"
    ]
  ],
  "rootDir": "/Users/erickim/Documents/Develop/react/glfm",
  "name": "005c8bf9b4d78dfa0bb0e32c0c55b0fb",
  "testRunner": "/Users/erickim/Documents/Develop/react/glfm/node_modules/jest-jasmine2/build/index.js",
  "cache": false,
  "watchman": true
}

推荐答案

我想出来了.默认情况下,jest不会从node_modules转换ES6 js代码.在我的例子中,react-navigation包模块需要翻译.所以我在jest配置中添加了transformIgnorePatterns,一切都正常:

{
  "preset": "react-native",
  "setupFiles": ["./test/setup.js"],
  "globals": {
    "__DEV__": true
  },
  "transform": {
    "^.+\\.js$": "babel-jest"
  },
  "transformIgnorePatterns": [
    "node_modules/(?!react-native|react-navigation)/"
  ]
}

https://facebook.github.io/jest/docs/tutorial-react-native.html#transformignorepatterns-customization

React-native相关问答推荐

如何更改分隔底部标签和屏幕内容的线的 colored颜色 ?React Native Tab导航器

我们如何才能将我们自己的应用程序(IOS)排除在共享表中?

expo 使用错误的版本代码创建建筑

react 本机 TextInput 将其他元素移出屏幕

使用动画标记时如何优化react 本机 map 性能

为什么当键盘出现在react native 时我的按钮会上升?按钮视图位置是绝对的?

我们应该在 react-native 移动应用程序中使用哪个图标库

如何在 React Native 的无状态功能组件中扩展原生组件的 props TypeScript 接口?

使用react native获取设备令牌

在整个屏幕上获取touch 事件

如何解决此错误您可能需要适当的加载程序来处理此文件类型

如何解决react-navigation 问题:Animated: `useNativeDriver` is not supported because the native animated module is missing.?

由于端口 8081 sunproxyadmin,无法打包 react native

在 Docker 中使用 Fastlane 构建 iOS 应用

无法在 react native >= 0.60 中链接assets(字体)

如何使 React Native Animated.View 可点击?

如何在 react-native 中从 AsyncStorage 中删除元素

Firebase 3.3 实时数据库坚持使用 React Native 0.32 Making a connection attempt

使用 React-Native Navigation 传递数据

react-native如何导入元素根目录?