Fix Import component on playground

[greg-a-smith]

The Import component for the playground is showing imports as:

import { ActionBar } from '/fundamental-react/src/';

This is not correct or how a consumer would truly import the component.

Consider showing tree-shakable imports that import directly from the path in addition to named imports (like shown above).

[PierreFritsch]

@greg-a-smith for the time being until this is fixed, is there a way for consumers to use the components?

In other words, how would I reference a component such as ActionBar from my app after doing npm install --save fiori-fundamentals fundamental-react and importing ../node_modules/fiori-fundamentals/scss/all.scss in my App.scss file?

I tried with import { ActionBar } from '../node_modules/fundamental-react/dist/'; but it doesn't seem to be the way to go:

(My guess is that I'd have to wait for https://github.com/SAP/fundamental-react/issues/113 first, right? )

[CodesOfRa]

Hi @PierreFritsch

I did a tiny sample app here : https://github.com/CodesOfRa/fundamental-react-demo

if you want to use a component you can use

import {Button} from 'fundamental-react/dist/Button/Button';

let me know if this is helping you.

[PierreFritsch]

Thanks @CodesOfRa - yes that helps!

From my point of view, it would make sense to include the contents of your sample project's README in the README file of this repository. That's exactly what I would expect as an external consumer under the section "Getting Started" (EDIT: or a section called "Usage" to keep it in sync with the docs of fundamental-vue)

[CodesOfRa]

@PierreFritsch We are working on that, we have an issue open for this - to add some sample apps as part for documentation/Readme