How to integrate Material Ui with Meteor?

Question

I am trying to integrate Material Ui with meteor and as a sample test tried executing the below but ended up with errors and no Idea how to resolve it. Anyone there to assist me in fixing this. Below are few detail to track.

How I installed? --> meteor npm install @material-ui/core

How I Integrated code? Through Blaze React component

ExampleTest.js

Template.ExampleTest.helpers({
  ExampleContainer() {
      return ExampleContainer;
    }
  });

ExampleContainer.js

const ExampleContainer = withTracker(() => {
---------
})(Example);

Example.js

import React, { Component } from "react";
import { Button } from "@material-ui/core";

class Example extends Component {
  constructor(props) {
    super(props);
  }

  render() {
    return (
      <div>
      <Button color="primary">Hello World</Button> 
      </div>
    );
  }
}

export default Example;

What error did I receive?

Error: In template "ExampleTest", call to `{{> React ... }}` missing `component` argument.
    at Blaze.View.<anonymous> (react-template-helper.js?hash=3fb2a2954362a4acdee8150fb77f0f500dd28206:67)
    at blaze.js?hash=cbd85c3fe14949f2d2b9a3b76334f5f0e96d553c:1934
    at Function.Template._withTemplateInstanceFunc (blaze.js?hash=cbd85c3fe14949f2d2b9a3b76334f5f0e96d553c:3769)
    at blaze.js?hash=cbd85c3fe14949f2d2b9a3b76334f5f0e96d553c:1932............

Any assistance on this?

Answer 1

It looks like you're using Blaze template engine. You should use React instead. https://www.meteor.com/tutorials/react/components

Answer 2

Material UI is a UI framework for use with React. It doesn't work with Blaze, and I don't think there is any way to use both Blaze and React in the same page.

To add Material UI to a Meteor/React project, install the package from the command line:

npm install @material-ui/core

And include the Roboto font in the head of your HTML:

<link rel="stylesheet" href="https://fonts.googleapis.com/css?family=Roboto:300,400,500,700&display=swap" />

For me this just worked, with nothing special needed for Meteor.

More instructions here: https://material-ui.com/getting-started/installation/