andes-plex v0.3.0
Plex: UI/UX para ANDES
Plex es un conjunto de componentes de UI/UX para el proyecto ANDES.
Instalación
Crear una nueva aplicación con angular-cli
ng new my-app cd my-app
Descargar desde npm
npm install andes-plex --save
Renombrar el archivo
src/styles.css
asrc/styles.less
y editarlo para vincular al archivo.less
de Plex@import '~andes-plex/src/lib/styles.less';
Crear un nuevo archivo
src/styles.sass
y editarlo para vincular al archivo.sass
de Plex@import '~andes-plex/src/lib/styles.sass';
Registrar ambos archivos de estilos en
angular-cli.json
, quitandostyles.css
... "styles": [ "styles.less", "styles.sass" ], ...
Modificar
app.component.html
con el siguiente contenido:<plex-app> </plex-app>
Crear un componente
home.component.ts
con el siguiente contenido:import { Component } from '@angular/core'; @Component({ template: 'Hello World', }) export class HomeComponent { }
Crear el archivo
app.routing.ts
y registrar el componente:import { Routes, RouterModule } from '@angular/router'; import { ModuleWithProviders } from '@angular/core'; import { HomeComponent } from './home.component'; const appRoutes: Routes = [ { path: '**', component: HomeComponent } ]; export const appRoutingProviders: any[] = []; export const routing: ModuleWithProviders = RouterModule.forRoot(appRoutes);
En
app.module.ts
importarPlexModule
y registrar los routings yPlexService
:import { BrowserModule } from '@angular/platform-browser'; import { NgModule } from '@angular/core'; import { FormsModule } from '@angular/forms'; import { HttpModule } from '@angular/http'; import { PlexModule } from 'andes-plex/src/lib/module'; import { PlexService } from 'andes-plex/src/lib/core/service'; import { routing, appRoutingProviders } from './app.routing'; // Components import { AppComponent } from './app.component'; import { HomeComponent } from './home.component'; @NgModule({ declarations: [ AppComponent, HomeComponent ], imports: [ BrowserModule, FormsModule, HttpModule, PlexModule, routing ], providers: [ PlexService, appRoutingProviders ], bootstrap: [AppComponent] }) export class AppModule { }
Correr la aplicacion
ng serve
ng serve
Navegar hasta
http://localhost:4200
7 years ago
7 years ago
7 years ago
7 years ago
7 years ago
7 years ago
7 years ago
7 years ago
7 years ago
7 years ago
7 years ago
7 years ago
7 years ago
7 years ago
7 years ago
7 years ago
7 years ago
7 years ago
7 years ago
7 years ago
7 years ago
7 years ago
7 years ago
7 years ago