--- layout : 'default' css : 'guide' title : 'Local Docs' description : 'A guide to generating docs locally' type : 'Semantic Project' --- <%- @partial('header') %>

Step by Step

It may be useful to run the development docs locally when working on a forked version of semantic, as the docs themselves help in testing out changes to ui components.

1. Install Node

Semantic docs are written in DocPad which requires NodeJS.

Make sure npm does not require sudo to operate, this might cause permissions issues.

2. Fork Semantic

3. Install Dependencies

Running update inside the local directory will grab all packages in package.json in the root of the project.

npm update

4. Start Your Server

docpad run

Docpad should now run an instance of semantic-ui.com locally you can access at http://localhost:9778

5. (Optional) Install Karma

Unit tests are written in Jasmine, but are run using a test runner called Karma. To install karma you need to grab the npm package.

npm install -g karma

Using Grunt

Watch Changes in Source

If you are working on fixing a UI component that is part of Semantic, your best bet is to work actively on the file in /src/{type}/{elementname}/ while running a watch script from grunt. This will rebuild the docs after you make changes, so you can see if you have corrected the issue you are fixing.

To see exactly what this is doing you can check out our commented gruntfile

grunt

The watch task is the default grunt task for Semantic, so you can start it quite simply.

Run Unit Tests

Tests will automatically run with grunt watch if you have started karma

karma start grunt watch

You can also run the test suite manually

npm test // or grunt test // or karma run

Build Semantic Packages Locally

For convenience there is also a separate grunt command for building minified, packaged, and compressed versions of the library.

grunt build

Next: Library Introduction