Unexpected token when trying to edit accounts-material for react-toolbox


#1

Hello everyone,

i’m writing because i’m trying to edit the package std:accounts-material to use react-toolbox instead of materialize but so far i’ve had no success, i’m using as guide lawrently’s accounts-material which he edited to use material-ui (https://github.com/lawrentiy/accounts-material/commit/650f29b751913e5439b459d9c5d8b2d1b5b69f72#diff-5a82d163aa6ac406a2219cef65f60760)

here’s what i’ve changed so far and the error i’m getting:

import { Button as MButton } from 'react-toolbox/lib/button';
import FontIcon from 'react-toolbox/lib/font_icon';

class Button extends Accounts.ui.Button {
  render() {
    const { label, type, disabled = false, onClick, className } = this.props;
    return type == 'link' ? (
      <a style={{cursor: 'pointer'}} className={ className } onClick={ onClick }>{ label }</a>
    ) : (
      <MButton
        onClick={ onClick }
        label={ label }>
        { type == 'submit' ? <FontIcon className='btnsend' value='send' /> : null }
      </MButton>
    );
  }
}

error:
W20160813-00:05:13.266(-5)? (STDERR) /home/john/dev/testapp/node_modules/react-toolbox/lib/ripple/theme.scss:1
W20160813-00:05:13.267(-5)? (STDERR) (function (exports, require, module, __filename, __dirname) { @import “…/colors”;
W20160813-00:05:13.267(-5)? (STDERR) ^
W20160813-00:05:13.267(-5)? (STDERR)
W20160813-00:05:13.267(-5)? (STDERR) SyntaxError: Unexpected token ILLEGAL
W20160813-00:05:13.268(-5)? (STDERR) at exports.runInThisContext (vm.js:53:16)
W20160813-00:05:13.268(-5)? (STDERR) at Module._compile (module.js:373:25)
W20160813-00:05:13.268(-5)? (STDERR) at Object.Module._extensions…js (module.js:416:10)
W20160813-00:05:13.268(-5)? (STDERR) at Module.load (module.js:343:32)
W20160813-00:05:13.269(-5)? (STDERR) at Module.Mp.load (/home/john/.meteor/packages/babel-compiler/.6.9.0.qsbxws++os+web.browser+web.cordova/npm/node_modules/reify/node/runtime.js:16:23)
W20160813-00:05:13.270(-5)? (STDERR) at Function.Module._load (module.js:300:12)
W20160813-00:05:13.270(-5)? (STDERR) at Module.require (module.js:353:17)
W20160813-00:05:13.270(-5)? (STDERR) at require (internal/module.js:12:17)
W20160813-00:05:13.271(-5)? (STDERR) at Object. (/home/john/dev/testapp/node_modules/react-toolbox/lib/ripple/index.js:13:14)
W20160813-00:05:13.271(-5)? (STDERR) at Module._compile (module.js:409:26)
=> Exited with code: 1
=> Your application is crashing. Waiting for file change.

original:

class Button extends Accounts.ui.Button {
  render() {
    const { label, type, disabled = false, onClick, className } = this.props;
    return type == 'link' ? (
      <a style={{cursor: 'pointer'}} className={ className } onClick={ onClick }>{ label }</a>
    ) : (
      <button className={ [
          'ui',
          type === 'submit' ? 'btn waves-effect waves-light' : 'btn-flat',
          disabled ? 'disabled' : '',
          className
        ].join(' ') } type={ type } disabled={ disabled }
        onClick={ onClick }>
        { label }
        { type == 'submit' ? <i className="material-icons right">send</i> : null }
      </button>
    );
  }
}

any help will be appreciated, thanks in advance

John