Aggelos Arvanitakis
1 min readJul 6, 2017


babel-lodash takes care of JS. We are roughly talking about .LESS files here. If you want to simply import each component independently you can simply write your imports like that:

import 'semantic-ui-less/definitions/elements/button.less';

There might be some plugin that allows “prettier” imports or you can set up a task to move all modules in the same directory in order not to go through all these directories every time. If you have in your mind something along the lines of:

import { Button } from 'semantic-ui-less'

then you’ re confusing .JS imports with .LESS/.CSS imports. If we were talking about the JS components of Semantic UI then you are right but now we are only talking about the styling and you can’t have named exports there. The only thing you can have is default imports along the lines of:

import Button from 'semantic-ui-less/definitions/elements/button.less';

which simply puts all the .LESS declarations in an “object” named Button.

if i am missing something or misinterpreting your question please correct me :)