How can I read Less variables in Javascript?

How can I read less variables in javascript like less-vars-to-js?

I'm working on a React project(webpack2、less etc), but not SSR(node environment)，so I can't use fs or node-glob module.

Some people suggest me writting a webpack loader myself :( i'm not really familiar with that... And I already used less-loader...

javascript

import lessToJs from 'less-vars-to-js';
import styles from './style.less';

const jsStyle = lessToJs(styles); => Uncaught TypeError: sheet.match is not a function

const mycomponent = (
  <MyComponent
    className={styles.nav}
    tintColor={jsStyle['@tint-color']}
  />
);

less

@import "../../../themes/theme.web.less";

@tint-color: grey;

.nav {
  background-color: @tint-color;
}

webpack

config.module.rules.push({
  test: /\.less$/,
  exclude: /node_modules/,
  use: [
    { loader: 'style-loader' },
    {
      loader: 'css-loader',
      options: {
        modules: true,
        importLoaders: 1,
      },
    },
    { loader: 'postcss-loader' },
    { loader: 'less-loader' },
  ],
});