Search code examples
javascripttwitter-bootstrapmeteorreactjs

How to use Bootstrap npm package with React


I have a meteor application which uses react at the front-end. I have installed bootstrap using npm (not atmospherejs), and I'm having trouble using the bootstrap styles in my react component. Here's the code for my main component.

import React from 'react';

import Bootstrap from 'bootstrap';

const Layout = ({content = () => null }) => (

  <div>
   <div className="row">
     <div className="col-xs-6 col-sm-4">.col-xs-6 .col-sm-4</div>
     <div className="col-xs-6 col-sm-4">.col-xs-6 .col-sm-4</div>      
     <div className="clearfix visible-xs-block"></div>
     <div className="col-xs-6 col-sm-4">.col-xs-6 .col-sm-4</div>
   </div>
  </div>  
);

export default Layout;

I'm new to react. Can someone tell me what's missing here and what I'm doing wrong?


Solution

  • This seems to be a known problem with Meteor. So I guess I'll have to depend on alternatives until MDG find a solution.

    Style files imports from node_modules