mirror of
https://github.com/richard-loafle/fuse-angular.git
synced 2025-01-08 19:45:08 +00:00
(docs) Updated docs
This commit is contained in:
sercan
parent
ee1caef303
commit
3395e7f0bc
|
|
@ -44,7 +44,7 @@
|
|||
<strong>mat-drawer</strong>.
|
||||
</p>
|
||||
<fuse-alert
|
||||
[appearance]="'outline'"
|
||||
[appearance]="'border'"
|
||||
[type]="'info'">
|
||||
Since fuse-drawer works with <em>absolute</em> positioning by default, the parent of the drawer must have
|
||||
<code>position: relative</code> and <code>overflow-x: hidden</code> properties otherwise the drawer won't be able to work correctly.
|
||||
|
|
|
|||
|
|
@ -55,7 +55,7 @@
|
|||
</p>
|
||||
|
||||
<fuse-alert
|
||||
[appearance]="'outline'"
|
||||
[appearance]="'border'"
|
||||
[type]="'info'">
|
||||
fuse-navigation designed to work with data and it must be supplied in certain format. If you want to create a navigation from an HTML structure,
|
||||
this component is not for you.
|
||||
|
|
|
|||
|
|
@ -57,7 +57,7 @@
|
|||
<li>If you need to present your idea to your client or to your boss without spending many hours and resources</li>
|
||||
</ul>
|
||||
<fuse-alert
|
||||
[appearance]="'outline'"
|
||||
[appearance]="'border'"
|
||||
[type]="'warning'">
|
||||
MockAPI is NOT a database or a backend replacement! It works on memory. As soon as you reload your app, all the changes you have made using Mock
|
||||
API endpoints will go away and replaced with defaults.
|
||||
|
|
@ -200,7 +200,7 @@
|
|||
mechanic, you will be able to mock API endpoints in no time.
|
||||
</p>
|
||||
<fuse-alert
|
||||
[appearance]="'outline'"
|
||||
[appearance]="'border'"
|
||||
[type]="'info'">
|
||||
Please keep in mind that the following step-by-step guide assumes you are doing everything from scratch for the <em>MockAPI</em> like creating directories, adding
|
||||
files, exporting via barrels etc. Majority of these already setup in both Demo and Starter apps for you so it's a bit easier to start working with the
|
||||
|
|
@ -213,7 +213,7 @@
|
|||
For this guide, we will assume you are going to use the default directory.
|
||||
</p>
|
||||
<fuse-alert
|
||||
[appearance]="'outline'"
|
||||
[appearance]="'border'"
|
||||
[type]="'info'">
|
||||
It's important to keep all mock related files in the same directory because we will create a barrel file that exports all the mock classes and provide that to the
|
||||
<code>FuseMockApiModule</code> so it can register and use them.
|
||||
|
|
|
|||
|
|
@ -70,7 +70,7 @@
|
|||
page.
|
||||
</p>
|
||||
<fuse-alert
|
||||
[appearance]="'outline'"
|
||||
[appearance]="'border'"
|
||||
[type]="'info'">
|
||||
Please note, you cannot run Angular components in here. Basically, by the time you can run Angular components, you won't be needing the
|
||||
splash screen because everything would already be loaded!
|
||||
|
|
|
|||
|
|
@ -48,7 +48,7 @@
|
|||
made configuration service to store, write and read application wide configurations.
|
||||
</p>
|
||||
<fuse-alert
|
||||
[appearance]="'outline'"
|
||||
[appearance]="'border'"
|
||||
[type]="'info'">
|
||||
More detailed information about <code>FuseConfigService</code> can be found in the
|
||||
<a [routerLink]="['../../../core-features/services/config']">Core features > Services >
|
||||
|
|
|
|||
|
|
@ -141,7 +141,7 @@
|
|||
</ul>
|
||||
|
||||
<fuse-alert
|
||||
[appearance]="'outline'"
|
||||
[appearance]="'border'"
|
||||
[type]="'info'">
|
||||
<div class="prose prose-sm max-w-none text-current">
|
||||
<p>
|
||||
|
|
|
|||
|
|
@ -39,7 +39,7 @@
|
|||
<div class="flex-auto max-w-3xl p-6 sm:p-10 prose prose-sm">
|
||||
|
||||
<fuse-alert
|
||||
[appearance]="'outline'"
|
||||
[appearance]="'border'"
|
||||
[type]="'info'">
|
||||
<span>
|
||||
Fuse uses route based component loading strategy. There are componentless and empty-path routes specifically structured to load components without hard
|
||||
|
|
|
|||
|
|
@ -48,24 +48,26 @@
|
|||
<textarea
|
||||
fuse-highlight
|
||||
lang="bash">
|
||||
ng build --prod
|
||||
ng build
|
||||
</textarea>
|
||||
|
||||
<h2>Alternate command</h2>
|
||||
<textarea
|
||||
fuse-highlight
|
||||
lang="bash">
|
||||
npm run build:prod
|
||||
npm run build
|
||||
</textarea>
|
||||
<p class="mb-12">
|
||||
Alias for <code>ng build --prod</code>.
|
||||
Alias for <code>ng build</code>.
|
||||
</p>
|
||||
|
||||
<p>
|
||||
<fuse-alert
|
||||
[appearance]="'border'"
|
||||
[type]="'info'">
|
||||
If you are getting error messages that includes keywords like <strong>HEAP</strong>, <strong>JS stack tree</strong>,
|
||||
<strong>out of memory</strong> while trying to run <code>ng build --prod</code> or <code>npm run build:prod</code> commands,
|
||||
you may have an older Node.js version, try updating your Node.js to the latest LTS version and then try again.
|
||||
</p>
|
||||
</fuse-alert>
|
||||
|
||||
<!-- Nav -->
|
||||
<div class="flex items-center xs:flex-col xs:items-stretch w-full mt-16">
|
||||
|
|
|
|||
|
|
@ -39,7 +39,7 @@
|
|||
<div class="flex-auto max-w-3xl p-6 sm:p-10 prose prose-sm">
|
||||
|
||||
<fuse-alert
|
||||
[appearance]="'outline'"
|
||||
[appearance]="'border'"
|
||||
[type]="'info'">
|
||||
Fuse's directory structure might look overwhelming and intimidating at first, but following this page and giving a bit time to understand it before jumping
|
||||
right into code will help immensely.
|
||||
|
|
@ -198,12 +198,6 @@
|
|||
<a [routerLink]="['../../../core-features/libraries/mock-api']">Core features > Libraries > MockAPI</a>
|
||||
section of this documentation.
|
||||
</p>
|
||||
<fuse-alert
|
||||
[appearance]="'outline'"
|
||||
[type]="'info'">
|
||||
<span class="font-medium">Starter</span>
|
||||
version of Fuse doesn't include any mock-api services except for the Navigation.
|
||||
</fuse-alert>
|
||||
|
||||
<h3>app/layout/</h3>
|
||||
<p>
|
||||
|
|
|
|||
|
|
@ -77,7 +77,7 @@
|
|||
After choosing the version you want to install, unzip the .zip file of that version into your workspace directory.
|
||||
</p>
|
||||
<fuse-alert
|
||||
[appearance]="'outline'"
|
||||
[appearance]="'border'"
|
||||
[type]="'info'">
|
||||
<div class="prose prose-sm max-w-none text-current">
|
||||
<p>
|
||||
|
|
@ -107,7 +107,7 @@
|
|||
This command will take some time and install all the required libraries into the <strong>node_modules</strong> directory in order for you to start developing.
|
||||
</p>
|
||||
<fuse-alert
|
||||
[appearance]="'outline'"
|
||||
[appearance]="'border'"
|
||||
[type]="'info'">
|
||||
<div class="prose prose-sm max-w-none text-current">
|
||||
<p>
|
||||
|
|
|
|||
|
|
@ -38,7 +38,6 @@
|
|||
|
||||
<div class="flex-auto max-w-3xl p-6 sm:p-10 prose prose-sm">
|
||||
|
||||
|
||||
<p>
|
||||
After the installation process finishes, run the following command while still in your workspace directory:
|
||||
</p>
|
||||
|
|
@ -64,11 +63,13 @@
|
|||
Alias for <code>ng serve --open</code>.
|
||||
</p>
|
||||
|
||||
<p>
|
||||
<fuse-alert
|
||||
[appearance]="'border'"
|
||||
[type]="'info'">
|
||||
If you are getting error messages that includes keywords like <strong>HEAP</strong>, <strong>JS stack tree</strong>,
|
||||
<strong>out of memory</strong> while trying to run <code>ng serve --open</code> or <code>npm start</code> commands,
|
||||
you may have an older Node.js version, try updating your Node.js to the latest LTS version and then try again.
|
||||
</p>
|
||||
</fuse-alert>
|
||||
|
||||
<!-- Nav -->
|
||||
<div class="flex items-center xs:flex-col xs:items-stretch w-full mt-16">
|
||||
|
|
|
|||
|
|
@ -43,14 +43,14 @@
|
|||
therefore they are located in the <code>src/app/layout/common/</code> directory. You can modify them without touching the <code>@fuse</code> directory.
|
||||
</p>
|
||||
<fuse-alert
|
||||
[appearance]="'outline'"
|
||||
[appearance]="'border'"
|
||||
[type]="'info'">
|
||||
These components are not very complex and they only provide some basic features. If you wish them to do more, you have to customize them, and that's exactly why
|
||||
they are not located in the <code>@fuse</code> directory like other components.
|
||||
</fuse-alert>
|
||||
<fuse-alert
|
||||
class="mt-4"
|
||||
[appearance]="'outline'"
|
||||
[appearance]="'border'"
|
||||
[type]="'info'">
|
||||
We may add more features and more custom components in the future if they will be beneficial for everyone. Components that are too specific to a project won't be
|
||||
included as custom components into Fuse!
|
||||
|
|
|
|||
|
|
@ -1,5 +1,6 @@
|
|||
import { NgModule } from '@angular/core';
|
||||
import { RouterModule } from '@angular/router';
|
||||
import { MatButtonModule } from '@angular/material/button';
|
||||
import { MatIconModule } from '@angular/material/icon';
|
||||
import { MatSidenavModule } from '@angular/material/sidenav';
|
||||
import { FuseHighlightModule } from '@fuse/components/highlight';
|
||||
|
|
@ -36,6 +37,7 @@ import { otherComponentsRoutes } from 'app/modules/admin/docs/other-components/o
|
|||
],
|
||||
imports : [
|
||||
RouterModule.forChild(otherComponentsRoutes),
|
||||
MatButtonModule,
|
||||
MatIconModule,
|
||||
MatSidenavModule,
|
||||
FuseHighlightModule,
|
||||
|
|
|
|||
Loading…
Reference in New Issue
Block a user