Babel 不从父目录转译文件

Question

如何让 babel 转译不在当前（根）目录中的文件？

这是我的项目结构：

|-project
    |build  
        |-node_modules
            -.babel.rc
            -package.json
    |src
    |test

我的源文件在 "src"，我的测试文件在 "test"。

我想从我的包 json 脚本中运行 mocha 测试。我使用 babel 即时转换我的 src 文件（ES6，React）。

这是我的 package.json:

"scripts": {
    "test": "mocha --require @babel/register '../test/**/*Test.js'"
}

和.babelrc:

{
    "presets": [
        "@babel/preset-env",
        "@babel/preset-react"
    ]
}

但是当我运行纱线测试时，我得到这样的错误信息：

/src/App.spec.js:1
(function (exports, require, module, __filename, __dirname) { import React from 'react';
                                                              ^^^^^^

SyntaxError: Unexpected token import

我试过 milion 配置组合，但没有任何效果，我不想在项目根目录中有 package.json 和 babel 配置文件（有效），我不知道如何在不改变项目结构的情况下告诉 babel 要转译什么。

Answer 1

从您发布的错误来看，您的 babel 配置似乎无法处理 jsx 语法。您可以通过安装 @babel/plugin-transform-react-jsx 插件来解决此问题。

并像这样配置它：

.babelrc

{
  ...
  "plugins": ["@babel/plugin-transform-react-jsx"]
}

Answer 2

我终于找到了这个解决方案：

package.json:

"test": "NODE_PATH=$PWD/node_modules:$PWD/../src/ mocha --require babelRegister.js ../test/**/*.spec.js"

babelRegister.js:

require('@babel/register')({
    extends: './.babelrc',
    ignore:  [/node_modules/],
});

"extends"和"ignore"都必须设置，否则无效。看起来很老套，但我没有找到更好的解决方案。

Babel 不从父目录转译文件

Babel not transpile files from parent dir

mocha.js

reactjs

babeljs

es6-modules