So I just want to start my first F7 app - using Meteor, React and all that nice stack!
I am new to F7, but very familiar with standard ES6 and all that.
No matter what I try to do, I can’t get it to work or import any components:
My main.js
entrypoint:
import Framework7 from 'framework7';
import Framework7React from 'framework7-react';
Framework7.use(Framework7React);
import App from '../ui/layouts/App';
render(<App />, document.getElementById('react-root'));
app.js
:
import { F7App, Statusbar, View, Page, Navbar, Toolbar, Link } from 'framework7-react';
console.log(F7App, Statusbar, View); // --> undefined undefined undefined
// > all of these imports are UNDEFINED
import F7App from 'framework7-react/components/app';
// > not working at all, as this file has standard ES6 syntax - not supported by Meteor yet and thus throwing a "Unexpected identifier" Error due to the "import ..."
// ...
class App extends React.PureComponent {
render() {
return (
<div id="app-root" className="root is-mobile">
<MainProvider>
<F7App params={f7params}>
<Statusbar />
<View main>
<Page>
<Navbar title="Awesome App"></Navbar>
<Toolbar bottom>
<Link>Link 1</Link>
<Link>Link 2</Link>
</Toolbar>
<p>Page content goes here</p>
<Link href="/about/">About App</Link>
</Page>
</View>
</F7App>
</MainProvider>
</div>
)
}
}
export default withMainContext(App)
I am out of ideas, I tried importing any .js file inside the framework7-react
package, anything I do either breaks the app or results in an undefined
for every import.
Please help!
Thanks, cheers, Patrick