开玩笑的 import 和 require 之间的区别

Question

我正在使用 react-native-router-flux 和 react-redux 为 react-native 项目编写我的第一个测试

我的代码类似于

jest.autoMockOff();
jest.setMock('react-native', {
    NativeModules: {}
});
jest.setMock('react-native-router-flux', {
    Actions: {}
});

const mockStore = require('../../mock/Store');
const actions = require('../myActions');
...
// Some tests that test if the right actions are dispatched.

上述方法有效，但是当我使用 ES6 import 而不是 require 时，我遇到了问题。

如果我替换

const actions = require('../myActions');

与

import * as actions from "../myActions"

我收到以下错误。

Runtime Error
  - Error: Cannot find module 'ReactNative' from 'react-native.js'
        at Resolver.resolveModule (node_modules/jest-cli/node_modules/jest-resolve/src/index.js:117:17)
        at Object.<anonymous> (node_modules/react-native/Libraries/react-native/react-native.js:175:25)
        at Object.<anonymous> (node_modules/react-native-router-flux/src/Scene.js:10:18)

虽然我可以解决这个问题，但我很想了解失败的原因， 另请注意，我无法在.bablerc 文件中使用es2015 预设转译react-native-router-flux，我认为我将不得不忍受这个限制（无法转译react-native-router-flux）。

myActions.js 看起来像

import {Actions} from 'react-native-router-flux';
export function searchRequest() {
    return {
        type: "search_request"
    }
}

export function searchRequestFailure(error) {
    return {
        type: "search_request_failure",
        error: error.toString()
    }
}

export function searchRequestSuccess(payload) {
    return {
        type: "search_request_success",
        payload: payload
    }
}

export function search(nameOrAddress) {
    return dispatch => {
        dispatch(searchRequest())
        return fetch("http://localhost:8080/search", {
            method: "GET"
        }).then((response) => {
            return response.json()
        }).then((responseData) => {
            dispatch(searchRequestSuccess(responseData))
            Actions.list() //react-native-router-flux dependency
        }).catch(error =>  {
            dispatch(searchRequestFailure(error))
        })
    }
}

使用 react-native 0.26 和 jest 12.1.1

Answer 1

这不是正确的 ES6 转换。

const actions = require('../myActions'); // requires the defaultMember of the exported module and

//ES6 (ES2015) equivalent is 
import actions from '../myActions';

https://developer.mozilla.org/en/docs/web/javascript/reference/statements/import