由于缺乏对Commonjs模块的支持,来自react_rails gem的令人沮丧之后,我正在测试netguru的react_webpack_rails gem.但从那时起我就遭到了不变的违规行为.
例如,如果我在ES6语法中编写一个简单的Hello World组件:
import React from 'react';
class tasksBox extends React.Component {
render() {
return <div>Hello World</div>;
}
}
export default tasksBox;
Run Code Online (Sandbox Code Playgroud)
提出这些错误:
Warning: React.createElement: type should not be null, undefined, boolean, or number. It should be a string (for DOM elements) or a ReactClass (for composite components).
Uncaught Error: Invariant Violation: Element type is invalid: expected a string (for built-in components) or a class/function (for composite components) but got: undefined.
Run Code Online (Sandbox Code Playgroud)
你的帮助将不胜感激,我无法弄清楚错误的来源.
我刚开始学习flex,到目前为止,我印象深刻。但是,我遇到了包含页眉/页脚和三列的整页应用程序的问题。第一列包含一个项目列表,由于我无法为其父项设置固定高度,因此每当列表增加时,它都会将页脚向下推。
这是具有布局的codepen:http : //codepen.io/anon/pen/vNVQNj Html:
<html>
<head>
<body>
<div class="app-wraper">
<div class="Navbar"></div>
<div class="main-content">
<div class="Bidlist">
<div class="column">
<div class="tabcontainer">
</div>
<div class="content-container">
<ul class="list-group instruments">
<li class="intrument"></li>
<li class="intrument"></li>
<li class="intrument"></li>
<li class="intrument"></li>
<li class="intrument"></li>
<li class="intrument"></li>
<li class="intrument"></li>
<li class="intrument"></li>
<li class="intrument"></li>
<li class="intrument"></li>
<li class="intrument"></li>
<li class="intrument"></li>
<li class="intrument"></li>
<li class="intrument"></li>
<li class="intrument"></li>
</ul>
</div>
</div>
</div>
</div>
<div class="footer"></div>
</div>
</body>
</head>
</html>
Run Code Online (Sandbox Code Playgroud)
CSS:
html,
body {
background-color: #212121;
overflow: hidden;
}
/* layout */ …Run Code Online (Sandbox Code Playgroud)