javascript - 导入 react-native-fetch-blob 时出现意外 token

Question

我们正在尝试使用以下代码导入 react-native-fetch-blob 包:

const RNFetchBlob = require('react-native-fetch-blob');
const firebase = require('firebase');

但是，当我们尝试构建时，出现如下意外 token 导入语法错误。

C:\Users\ ...\node_modules\react-native-fetch-blob\index.js:5
import {
^^^^^^
SyntaxError: Unexpected token import
at Object.exports.runInThisContext (vm.js:76:16)
at Module._compile (module.js:513:28)
at Object.Module._extensions..js (module.js:550:10)
at Module.load (module.js:458:32)
at tryModuleLoad (module.js:417:12)
at Function.Module._load (module.js:409:3)
at Module.require (module.js:468:17)
at require (internal/module.js:20:19)
at Object. (C:\Users\ ...\build\cloud\file.js:159:243) at Module._compile (module.js:541:32)

我们正在使用 ES6，我们的 .babelrc 文件如下所示

"plugins": [
    ["transform-runtime", {
        "polyfill": false,
        "regenerator": true
    }]
],
"presets": ["react-native","es2015",]

有解决办法吗？任何帮助将不胜感激!

谢谢!

Answer 1

我能够通过为 react-native-fetch-blob(在我的例子中是 rn-fetch-blob)创建一个模拟来解决这个问题。这里建议的模拟对我有用:https://github.com/wkh237/react-native-fetch-blob/issues/212#issuecomment-340706825

As @scerelli I also wanted the mock to happen in a separate place so it can be used by all tests. Placing the following code in /mocks/react-native-fetch-blob.js seems to work for me:

const existsMock = jest.fn(); existsMock.mockReturnValueOnce({then: jest.fn()});

export default {
DocumentDir: () => {},
ImageCache: {
    get: {
        clear: () => {},
    },
},
fs: {
    exists: existsMock,
    dirs: {
        MainBundleDir: () => {},
        CacheDir: () => {},
        DocumentDir: () => {},
    },
    },
};

It's a variation of @SoundBlaster solution, just in a global mock file. With that I don't need to import or implicitly mock anything in the test code.