ngx-smart-skeleton
Skeleton UI library
Smart Skeleton of Angular is dedicated to provide a good development experience for programmers.
Before delving into Smart Skeleton in Angular, a good knowledge of Angular and JavaScript ES2015 is needed.
Documentation
https://ngxsmartskeleton.web.app/
Installation
We strongly recommend to develop Angular with @angular/cli, you can install it with the following commands.
Read the documentation of Angular to explore more features.
$ npm install -g @angular/cli
Create a New Project
A new project can be created using Angular CLI tools.
$ ng new PROJECT-NAME
@angular/cli will run npm install after a project is created. If it fails, you can run npm install by yourself.
Development & Debugging
Run your project now, you can see the img below now.
$ ng serve --port 0 --open
Building & Deployment
$ ng build --prod
Entry files will be built and generated in dist directory, where we can deploy it to different environments.
Install ngx-smart-skeleton
$ npm install ngx-smart-skeleton --save
Import Styles
Asserts
This configuration will include all the assert of the component library.
In angular.json add the assert of ngx-smart-skeleton
"assets": [
"src/favicon.ico",
"src/assets",
{
"glob": "**/*",
"input": "./node_modules/ngx-smart-skeleton/assets/",
"output": "/assets/"
}
],
Import Component Module
Finally, you need to import the component modules you want to use into your app.module.ts file and feature modules.
Take the following Button Module module as an example, first introduce the component module:
import { NgxSmartSkeletonModule } from 'ngx-smart-skeleton';
import { AppComponent } from './app.component';
@NgModule({
declarations: [
AppComponent
],
imports: [
NgxSmartSkeletonModule
]
})
export class AppModule { }
Then use in the template:
<skc-skeleton [loading]="loading" [type]="'line'"> </skc-skeleton>