CODEWITHSUNDEEP
meteorinstallationaccordionsemantic-ui
brianjlennon
brianjlennon

Reputation: 159

Full instructions for Meteor Semantic-ui integration by a frustrated n00bie?

I wish there were better instructions for installing and getting started with Semantic-ui on Meteor....please see below.

Any improvements/feedback welcome.

Upvotes: 3

Views: 738

Answers (1)

brianjlennon
brianjlennon

Reputation: 159

I just decided to post these because of some difficulties I had getting semantic-ui to work with Meteor. I figured out the few things I was not getting from various answers across various forums:

  1. Install via CLI: meteor add semantic:ui flemay:less-autoprefixer (You don't need to worry about LESS)
  2. Create an empty custom.semantic.json file in /client/lib/semantic-ui/custom.semantic.json. (Note this is NOT the lib folder that is outside the client and server folders - make a new lib folder. Putting it in the original lib will cause your app to crash because jQuery hasn't been loaded
  3. Start meteor - the custom.semantic.json file will populate and all the semantic-ui files will be added to your project in the same folder.
  4. Edit the file custom.semantic.json to select only the definitions and themes you want
  5. If you are happy with the default values you will need to remove .custom.semantic.json to generate Semantic UI - in all likelihood you will want to delete this file.
  6. Save the file and it will generate Semantic UI

It hasn't been an issue for me yet but it appears that if you are changing theme you still need to leave the default theme setting as true. This seemed to be causing people confusion.

I wanted to use the accordion and couldn't figure how to get it working. The HTML from the docs is very straightforward but I needed this JS to get me going:

Template.yourTemplate.rendered = function() {
    $('.ui.accordion').accordion();
}

If anyone knows a better way, please jump in.

Hope this helps someone avoid the minor frustrations I had earlier today.

Upvotes: 3

Related Questions