Fetch a variable from node_modules - node.js

Question

I am trying to fetch a variable from node_modules to my application. I have exported it with module.exports, but when I use require('path/of/required/file/in/node_modules') it is showing 'unexpected token import'. I am trying to get the user info from node_modules since there is no official strategy for keystone to fetch the user data.
My local file
var keystone = require('keystone');
Teaching = keystone.list('teaching');
UserInfo = require('../../node_modules/keystone/admin/client/App/components/Footer/index.js').footer;
User = keystone.list(keystone.get('user model'));
console.log(User);
exports = module.exports =function(req,res){
var view = new keystone.View(req,res);
var locals = res.locals;
locals.section = 'teaching';
locals.data = {
teachingData : []
};
view.on('init',function(next){
var teaching = Teaching.model.find();
teaching.exec(function(err,results){
locals.data.teachingData = results;
//console.log(locals.data.teachingData);
next(err);
});
});
view.render('teaching');
}
Node_module file
import React from 'react';
import { css, StyleSheet } from 'aphrodite/no-important';
import { Container } from '../../elemental';
import theme from '../../../theme';
var Footer = React.createClass({
displayName: 'Footer',
propTypes: {
appversion: React.PropTypes.string,
backUrl: React.PropTypes.string,
brand: React.PropTypes.string,
user: React.PropTypes.object,
User: React.PropTypes.object, // eslint-disable-line react/sort-prop-types
version: React.PropTypes.string,
},
// Render the user
renderUser () {
const { User, user } = this.props;
if (!user) return null;
return (
<span>
<span> Signed in as </span>
<a href={`${Keystone.adminPath}/${User.path}/${user.id}`} tabIndex="-1" className={css(classes.link)}>
{user.name}
</a>
<span>.</span>
</span>
);
},
render () {
const { backUrl, brand, appversion, version } = this.props;
return (
<footer className={css(classes.footer)} data-keystone-footer>
<Container>
<a
href={backUrl}
tabIndex="-1"
className={css(classes.link)}
>
{brand + (appversion ? (' ' + appversion) : '')}
</a>
<span> powered by </span>
<a
href=""
target="_blank"
className={css(classes.link)}
tabIndex="-1"
>
VK
</a>
<span> version {version}.</span>
{this.renderUser()}
</Container>
</footer>
);
},
});
/* eslint quote-props: ["error", "as-needed"] */
const linkHoverAndFocus = {
color: theme.color.gray60,
outline: 'none',
};
const classes = StyleSheet.create({
footer: {
boxShadow: '0 -1px 0 rgba(0, 0, 0, 0.1)',
color: theme.color.gray40,
fontSize: theme.font.size.small,
paddingBottom: 30,
paddingTop: 40,
textAlign: 'center',
},
link: {
color: theme.color.gray60,
':hover': linkHoverAndFocus,
':focus': linkHoverAndFocus,
},
});
exports.footer = Footer.renderUser();

Answer 1

1) The "Unexpected token import" error is probably occuring because the current JavaScript environment does not support the import statement; the code you are trying to import from the Keystone node module is transpiled before it gets used normally. When Keystone uses that component, it's not an issue. But if you're importing a React component into a non-React file, you're bound to have problems. Which leads to my next question:
2) UserInfo isn't used in your code at all. You can't just use Keystone's React component for showing user information, unless you are working in a React environment (which it does not look like you are.) What is your use case for using this component?