Documentation slowly growing at https://docs.recoverycat.de
Examples:
As of now there are no npm packages available, sorry.
If you have not installed yarn you need to run npm install yarn -g
git clone https://gitlab.com/recoverycat/rcc-client rcc
via terminal or use your favourite IDEcd rcc
npm install
or better yarn install
to install the necessary dependencies (npm install -g @angular/cli
ng serve @rcc/app --configuration=doc --ssl
to serve the app version for doctors, or ng serve @rcc/app --configuration=pat --ssl
to serve the app version for patients.you should see sth. like:
** Angular Live Development Server is listening on localhost:4200, open your browser on http://localhost:4200/ **
✔ Compiled successfully.
From here you can start working on additional or existing modules in e.g. @rcc/features (via: lib/features) and test it by adding it to the app/src/app/app.module.ts. That's probably the best way if you want to contribute to the project.
But if you want to do something more standalone, there are three ways to do it. All of them rather awkward because we have not yet published any packages:
Here's how this works:
Add a new angular application to the workspace: ng generate application my-app-name
(no extra routing needed)
Then change your app-module.ts to look like this:
//app-module.ts
import { NgModule } from '@angular/core'
import {
IonicBaseAppComponent,
IonicBaseAppModule
} from '@rcc/ionic'
import {
//...
RccRoutingModule
} from '@rcc/common'
@NgModule({
imports: [
IonicBaseAppModule,
//...
RccRoutingModule //should be last for now
],
bootstrap: [IonicBaseAppComponent]
})
export class AppModule { }
This should give you a running, but empty app. (try ng serve my-app-name
)
In order to see some content add the HomePageModule:
//app-module.ts
import { NgModule } from '@angular/core'
import {
IonicBaseAppComponent,
IonicBaseAppModule
} from '@rcc/ionic'
import {
RccRoutingModule,
HomePageModule, //<---
//...
} from '@rcc/common'
@NgModule({
imports: [
HomePageModule, //<---
IonicBaseAppModule,
//...
RccRoutingModule //should be last for now
],
bootstrap: [IonicBaseAppComponent]
})
export class AppModule { }
This time there's a Heading and a menu button. But some styles and the icon on the menu button are missing. Two steps are in order to fix this:
/* styles.css */
@import "~@rcc/ionic/assets/ionic-styles.scss";
@import "~@rcc/ionic/assets/theme.scss";
{
//...
"projects":{
//...
"my-app-name":{
//...
"architect":{
//...
"build": {
//...
"options":{
//...
"assets":[
//...
{
"glob": "**/*.svg",
"input": "node_modules/ionicons/dist/ionicons/svg",
"output": "./svg"
}
]
}
}
}
}
}
}
After this you should see the proper fonts and icons, and a very small main menu with a link to the home screen you already know and a settings page that only consists of the language settings.
You can now use the packages of the /lib folder by importing from @rcc/common, @rcc/core, @rcc/examples or @rcc/ionic respectively.
Try adding some of the modules from lib/common oder lib/features. Maybe tale a look at @rcc/app for inspiration. Sadly there is very little documentation for most of the modules for now, so you will have to figure things out by yourself for the time being. The exmaples in lib/examples maybe a good starting point.
TODO...
Add "compilerOptions": { "resolveJsonModule": true, ... } to your root tsconfig.json
{
"compilerOptions": {
"resolveJsonModule": true,
}
}
If you move the new workspace to the app folder which contains the workspaces full & doc, you have to also fix the relative paths inside your angular.json. Please compare to other workspaces such as doc for reference.
Lastly also go to the tsconfig.spec.json of your new workspace. There add ../
to the "extends" file path so it looks like this:
"extends": "../../tsconfig.json"