Mocha无法读取已转译的@ babel /注册码

时间:2018-12-02 17:55:22

标签: node.js reactjs mocha babel create-react-app

我正在尝试在create-react-app创建的应用程序中实现Mocha。我更改了测试脚本,现在它指向的是Mocha,并且我使用@babel/register "^7.0.0"进行了编译。我的package.json如下。

{...
  "scripts": {
    "start": "react-scripts start",
    "build": "react-scripts build",
    "test": "NODE_ENV=test mocha --require node_modules/.bin/@babel/register src/test/*.test.js",
    "eject": "react-scripts eject"
  },
  ...
  "devDependencies": {
    "@babel/core": "^7.1.6",
    "@babel/plugin-transform-modules-commonjs": "^7.1.0",
    "@babel/plugin-transform-react-jsx": "^7.1.6",
    "@babel/preset-env": "^7.1.6",
    "@babel/register": "^7.0.0",
    "babel-preset-react-app-babel-7": "^4.0.2-0",
    "chai": "^4.2.0",
    "chai-enzyme": "^1.0.0-beta.1",
    "cheerio": "^1.0.0-rc.2",
    "enzyme": "^3.7.0",
    "mocha": "^5.2.0"
  }
}

我的根文件夹中有一个.babelrc文件,其配置如下:

{
    "presets": [
        "react-app"
    ],
    "plugins": [
        "@babel/plugin-transform-modules-commonjs"
    ]
}

当我为Javascript运行npm test时,一切正常,文件可以正常运行。当我尝试测试React组件时,出现以下语法错误,并且在svg节点中的create-react-app启动画面中导入默认图像时会发生这种错误。他不认识<字符

我尝试使用preset-env,使用plugin-transform-jsx,使用preset-react(而不是preset-react-app)来更改预设/插件中的许多配置系列,我也试图使用es2015降级babel,但我没有成功,总是出现相同的错误。

我不知道babel / register是否存在无法正确转译(或根本无法转译)的问题,或者我是否在配置中缺少其他内容。有人可以帮忙吗?

在我得到的错误下面,我认为这是来自摩卡咖啡:

/home/user_me/test-mocha/src/logo.svg:1
(function (exports, require, module, __filename, __dirname) { <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 841.9 595.3">
                                                              ^

SyntaxError: Unexpected token <
    at new Script (vm.js:79:7)
    at createScript (vm.js:251:10)
    at Object.runInThisContext (vm.js:303:10)
    at Module._compile (internal/modules/cjs/loader.js:656:28)
    at Module._extensions..js (internal/modules/cjs/loader.js:699:10)
    at Object.newLoader [as .js] (/home/alessandro/Development/test-mocha/node_modules/pirates/lib/index.js:88:7)
    at Module.load (internal/modules/cjs/loader.js:598:32)
    at tryModuleLoad (internal/modules/cjs/loader.js:537:12)
    at Function.Module._load (internal/modules/cjs/loader.js:529:3)
    at Module.require (internal/modules/cjs/loader.js:636:17)
    at require (internal/modules/cjs/helpers.js:20:18)
    at Object.<anonymous> (/home/alessandro/Development/test-mocha/src/App.js:2:1)
    at Module._compile (internal/modules/cjs/loader.js:688:30)
    at Module._compile (/home/alessandro/Development/test-mocha/node_modules/pirates/lib/index.js:83:24)
    at Module._extensions..js (internal/modules/cjs/loader.js:699:10)
    at Object.newLoader [as .js] (/home/alessandro/Development/test-mocha/node_modules/pirates/lib/index.js:88:7)
    at Module.load (internal/modules/cjs/loader.js:598:32)
    at tryModuleLoad (internal/modules/cjs/loader.js:537:12)
    at Function.Module._load (internal/modules/cjs/loader.js:529:3)
    at Module.require (internal/modules/cjs/loader.js:636:17)
    at require (internal/modules/cjs/helpers.js:20:18)
    at Object.<anonymous> (/home/alessandro/Development/test-mocha/src/test/App.test.js:3:1)
    at Module._compile (internal/modules/cjs/loader.js:688:30)
    at Module._compile (/home/alessandro/Development/test-mocha/node_modules/pirates/lib/index.js:83:24)
    at Module._extensions..js (internal/modules/cjs/loader.js:699:10)
    at Object.newLoader [as .js] (/home/alessandro/Development/test-mocha/node_modules/pirates/lib/index.js:88:7)
    at Module.load (internal/modules/cjs/loader.js:598:32)
    at tryModuleLoad (internal/modules/cjs/loader.js:537:12)
    at Function.Module._load (internal/modules/cjs/loader.js:529:3)
    at Module.require (internal/modules/cjs/loader.js:636:17)
    at require (internal/modules/cjs/helpers.js:20:18)
    at /home/alessandro/Development/test-mocha/node_modules/mocha/lib/mocha.js:250:27
    at Array.forEach (<anonymous>)
    at Mocha.loadFiles (/home/alessandro/Development/test-mocha/node_modules/mocha/lib/mocha.js:247:14)
    at Mocha.run (/home/alessandro/Development/test-mocha/node_modules/mocha/lib/mocha.js:576:10)
    at Object.<anonymous> (/home/alessandro/Development/test-mocha/node_modules/mocha/bin/_mocha:637:18)
    at Module._compile (internal/modules/cjs/loader.js:688:30)
    at Object.Module._extensions..js (internal/modules/cjs/loader.js:699:10)
    at Module.load (internal/modules/cjs/loader.js:598:32)
    at tryModuleLoad (internal/modules/cjs/loader.js:537:12)
    at Function.Module._load (internal/modules/cjs/loader.js:529:3)
    at Function.Module.runMain (internal/modules/cjs/loader.js:741:12)
    at startup (internal/bootstrap/node.js:285:19)
    at bootstrapNodeJSCore (internal/bootstrap/node.js:739:3)

1 个答案:

答案 0 :(得分:0)

这里的问题是我正在我的一个jsx模块中导入一个内联svg文件。 Babel没有任何插件可以转换svg,因此出现“ <”意外令牌。我可以通过添加Babel inline svg plugin并按如下方式更改.babelrc来工作。

$(document).ready(function () {
    var options = {
        pages: ["http://www.google.com","http://www.stackoverflow.com"].map((u)=>{return {src: u };}) ,
        singlePageMode: true
    };
    $("#pdfbox").flipBook(options);
}) 

它奏效了。