我正在尝试在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)
答案 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);
})
它奏效了。