javascript - react Mocha - `Missing class properties transform`

Question

我开始在我的 mocha 测试中使用 es6，但它失败了:缺少类属性转换。

测试

"test": "BABEL_ENV=test nyc mocha --watch tap 'test/**/*.spec.js'",

组件

class SignIn extends React.Component {
    constructor(props) {
        super(props);
        this.state = {
            email: 'as',
            pw: 'as'
        };

        this.logIn = this.logIn.bind(this);
        this.changed = this.changed.bind(this);
    }

    changed = ( e ) => {
        let newDeets = {};
        newDeets[e.target.name] = e.target.value;
        this.setState(newDeets);
    };

.babelrc

{
  "presets": ["es2015", "react","react-hmre"],
  "ignore": [
    "public/**/*.js"
  ],
}

package.json

"autoprefixer": "^6.4.0",
"babel-core": "^6.11.4",
"babel-eslint": "^4.1.6",
"babel-jscs": "^2.0.5",
"babel-loader": "^6.2.4",
"babel-preset-es2015": "^6.9.0",
"babel-preset-react": "^6.11.1",
"babel-preset-react-hmre": "^1.1.1",
"babel-preset-stage-0": "^6.5.0",

错误

> BABEL_ENV=test nyc mocha --watch tap 'test/**/*.spec.js'

/var/www/kindred.com/node_modules/babel-core/lib/transformation/file/index.js:590
      throw err;
      ^

SyntaxError: /var/www/kindred.com/src/components/Signin/index.js: Missing class properties transform.
  17 |   }
  18 | 
> 19 |   changed = ( e ) => {
     |   ^
  20 |     let newDeets = {};
  21 |     newDeets[e.target.name] = e.target.value;
  22 |     this.setState(newDeets);

Answer 1

问题是你没有告诉 mocha 使用 babel。你可以 npm install --save-dev babel-register 并使用 mocha --require babel-register

所以你的测试命令看起来像:

"test": "BABEL_ENV=test nyc --require babel-register mocha --watch tap 'test/**/*.spec.js'",