{
test: /\.js$/,
{
loader: 'babel-loader',
options: {
presets: ['es2015', 'stage-0', 'react']
}
}]
},npm install -S babel-preset-stage-0
const first = 'some classes';
const second = 'some classes';
const myQuery = {
hasMinWidth: {
minWidth: 1024,
},
};
class Header extends Component {
state = {
headerSticky: headerSticky(),
};
componentDidMount() {
window.addEventListener('scroll', this.handleScroll);
};
componentWillUnmount() {
window.removeEventListener('scroll', this.handleScroll);
};
handleScroll = e => {
this.setState({
headerSticky: headerSticky(),
});
};
getHeaderClass() {
const {
containerQuery: { hasMinWidth },
} = this.props;
return hasMinWidth ? first : second;
}
render() {
const {
headerSticky,
} = this.state;
const headerClasses = headerSticky + this.getHeaderClass();
return (
<div className={headerClasses}>
<Grid>
<Row>
<Col sm={2} xs={6}>
<img src={logo} className="header-logo" alt=""/>
</Col>
<Col sm={10} xsHidden={true}>
<nav className="header-nav">
{header_links.map((anchor) => (
<a href={anchor.link}>{anchor.name}</a>
))}
</nav>
</Col>
</Row>
</Grid>
</div>
);
}
}
export default applyContainerQuery(Header, myQuery);
1. видимо, не читали моих аргументов
2. не знаете о чем говорите
3. не работали в проектах в которых надо писать код
Последний раз когда работал с VanillaJS, а это была разработка немецкой социальной сети на Laravel + ES6. За время разработки была написана собственная библиотека https://github.com/Mevrael/bunny .
Если бы мы хотя бы использовали JQuery, время разработки фронтовой части сократили бы, как минимум, вдвое.
Но по-хорошему надо было использовать React или Angular.
Такое вот дурацкое решение руководства и CTO. Это был 2015 год, тогда модно было говорить, что с ES6 можно можно эффективно писать сложные проекты на ванильном js, но на практике это оказалось не так.