Мокко не может прочитать транслированный @ babel / регистрационный код - PullRequest
0 голосов
/ 02 декабря 2018

Я пытаюсь внедрить Mocha в приложение, созданное с помощью create-реагировать на приложение.Я изменил тестовый скрипт, теперь он указывает на 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"
    ]
}

Когда я запускаю npm test для Javascriptвсе работает нормально и файл попадает в мокко ок.Когда я пытаюсь протестировать компоненты React, я получаю синтаксическую ошибку ниже, и это происходит в узле svg при импорте изображения по умолчанию на заставке create-реагировать в приложении.Он не распознает символ <

Я пытался изменить множество серий конфигурации в своих пресетах / плагинах, используя preset-env, используя plugin-transform-jsx, используя preset-react (вместо preset-react-app)Я также пытался понизить версию babel, используя es2015, но у меня ничего не вышло, всегда была одна и та же ошибка.

Я не понимаю, есть ли проблема с неправильным переносом 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 голосов
/ 13 декабря 2018

Проблема здесь заключалась в том, что я импортировал встроенный файл SVG в один из моих модулей JSX.У Бабеля не было плагинов для переноса svg, следовательно, неожиданный токен "<".Я заставляю его работать, добавляя <a href="https://www.npmjs.com/package/babel-plugin-inline-react-svg" rel="nofollow noreferrer"> встроенный плагин svg Babel и меняя мой .babelrc следующим образом.

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

И это сработало.

...