An open API service indexing awesome lists of open source software.

https://github.com/ged/aurelia-semantic-ui-demo

Demo application/documentation for aurelia-semantic-ui (Github mirror)
https://github.com/ged/aurelia-semantic-ui-demo

Last synced: 5 months ago
JSON representation

Demo application/documentation for aurelia-semantic-ui (Github mirror)

Awesome Lists containing this project

README

          

# aurelia-semantic-ui-demo

This is the demo app and documentation for [the Semantic UI Aurelia plugin](https://ged.github.com/aurelia-semantic-ui).

It's still very much a work in progress. Suggestions/pull requests welcomed.

## Running The App

To run the app, follow these steps.

1. Ensure that [NodeJS](http://nodejs.org/) is installed. This provides the platform on which the build tooling runs.
2. From the project folder, execute the following command:

```shell
npm install
```
3. Ensure that [Gulp](http://gulpjs.com/) is installed globally. If you need to install it, use the following command:

```shell
npm install -g gulp
```
> **Note:** Gulp must be installed globally, but a local version will also be installed to ensure a compatible version is used for the project.
4. Ensure that [jspm](http://jspm.io/) is installed globally. If you need to install it, use the following command:

```shell
npm install -g jspm
```
> **Note:** jspm must be installed globally, but a local version will also be installed to ensure a compatible version is used for the project.

> **Note:** jspm queries GitHub to install semver packages, but GitHub has a rate limit on anonymous API requests. It is advised that you configure jspm with your GitHub credentials in order to avoid problems. You can do this by executing `jspm registry config github` and following the prompts. If you choose to authorize jspm by an access token instead of giving your password (see GitHub `Settings > Personal Access Tokens`), `public_repo` access for the token is required.
5. Install the client-side dependencies with jspm:

```shell
jspm install -y
```
>**Note:** Windows users, if you experience an error of "unknown command unzip" you can solve this problem by doing `npm install -g unzip` and then re-running `jspm install`.
6. To run the app, execute the following command:

```shell
gulp watch
```
7. Browse to [http://localhost:9000](http://localhost:9000) to see the app. You can make changes in the code found under `src` and the browser should auto-refresh itself as you save files.

> The `watch` task uses [BrowserSync](http://www.browsersync.io/) for automated page refreshes on code/markup changes concurrently across multiple browsers. If you prefer to disable the mirroring feature set the [ghostMode option](http://www.browsersync.io/docs/options/#option-ghostMode) to false

## Running The App under Electron

To run the app under [Electron](http://electron.atom.io), follow these steps.

1. Install [Electron](http://electron.atom.io)

```shell
npm install electron-prebuilt -g
```
2. To start the app, execute the following command:

```shell
electron index.js
```

## Bundling
Bundling is performed by [Aurelia Bundler](http://github.com/aurelia/bundler). A gulp task is already configured for that. Use the following command to bundle the app:

```shell
gulp bundle
```

You can also unbundle using the command bellow:

```shell
gulp unbundle
```

To start the bundled app, execute the following command:

```shell
gulp serve-bundle
```

#### Configuration
The configuration is done by ```bundles.js``` file.

##### Optional
Under ```options``` of ```dist/aurelia``` add ```rev: true``` to add bundle file revision/version.

## Exporting bundled production version
A gulp task is already configured for that. Use the following command to export the app:

```shell
gulp export
```
The app will be exported into ```export``` directory preserving the directory structure.

#### Configuration
The configuration is done by ```bundles.js``` file.
In addition, ```export.js``` file is available for including individual files.