[英]React Mocha - `Missing class properties transform`
I'm starting to use es6 with my mocha tests, but its failing with: Missing class properties transform.
我开始在我的mocha测试中使用es6,但它失败了:
Missing class properties transform.
Test 测试
"test": "BABEL_ENV=test nyc mocha --watch tap 'test/**/*.spec.js'",
Component 零件
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 .babelrc
{
"presets": ["es2015", "react","react-hmre"],
"ignore": [
"public/**/*.js"
],
}
package.json 的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",
Error 错误
> 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);
The problem is that you don't tell mocha to use babel. 问题是你不告诉摩卡使用babel。 You can
npm install --save-dev babel-register
and use mocha --require babel-register
你可以
npm install --save-dev babel-register
并使用mocha --require babel-register
So your test command would look like: 所以你的测试命令看起来像:
"test": "BABEL_ENV=test nyc --require babel-register mocha --watch tap 'test/**/*.spec.js'",
babel-core already comes with the register you need to run mocha with es6. babel-core已经带有你需要用es6运行mocha的寄存器。 There's no need to install it.
没有必要安装它。
You should try using the --compilers option. 您应该尝试使用--compilers选项。 I use the following command to test my es6 applications:
我使用以下命令来测试我的es6应用程序:
"./node_modules/.bin/mocha --timeout 0 --compilers js:babel-core/register --reporter spec"
Although, the error you are getting: 虽然,你得到的错误:
SyntaxError: /var/www/kindred.com/src/components/Signin/index.js: Missing class properties transform.
SyntaxError:/var/www/kindred.com/src/components/Signin/index.js:缺少类属性转换。
Is probably due syntax error. 可能是由于语法错误。 Try changing
尝试改变
changed = ( e ) => {
let newDeets = {};
newDeets[e.target.name] = e.target.value;
this.setState(newDeets);
};
to 至
changed(e) {
let newDeets = {};
newDeets[e.target.name] = e.target.value;
this.setState(newDeets);
}
For what I know, es6 class syntax doesnt allow the creation of variables in the class scope, only declaration of functions. 据我所知,es6类语法不允许在类范围内创建变量,只允许声明函数。
One more thing, in order to es6 work with the import
(instead of require
) keyword, I also needed to add "stage-0", to my presets in babelrc. 还有一件事,为了es6使用
import
(而不是require
)关键字,我还需要将“stage-0”添加到babelrc中的预设中。
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.