cap-utilities v0.0.12

CAP Utilities 💡

CAP Utilities is part of the CAP Generator and was created to provider a collection of general and useful utilities for Schematics in Angular.

To learn more about Schematics we recomend you to see the Schematic documentation.

How to install❓

To Install using npm, simply do:

npm install cap-utilities

How to Use❓

To import all the functions we recommend you the following import declaration:

import * as astUtils from 'cap-utilities'

Functions 📂

• addStylesToAngularJSON
• addLinkStyleToHTMLHead
• addRoutes
• addBodyClass
• addEnvironmentVar
• addExportToModule
• addEntryComponentToModule
• addPackageToPackageJson
• addToNgModule
• appendToStartFile
• appendHtmlElementToBody
• getAppName
• getAppModulePath
• getAngularAppConfig
• getAppNameFromPackageJSON
• hasBootstrap
• isAngularBrowserProject
• readIntoSourceFile
• removeContentFromFile
• updateIndexFile
• updateIndexHeadFile
• updateBodyOfIndexFile
• addIdToElement
• addToAngularJSONArchitectBudgets

addIdToElement

Disclaimer 🚧

This repository contains parts of code which is directly taken from Angular Schematics package. All credits go to the respective developers!

Importan

We are still working on the documentation of the functions (methods).

Functions 📂

addStylesToAngularJSON

Function to add styles into the angular. json.

Example:

  cap_utils.addStylesToAngularJSON(
    host, [
      './src/assets/webslidemenu/dropdown-effects/fade-down.css',
      './src/assets/webslidemenu/webslidemenu.scss'])

addLinkStyleToHTMLHead

Insert an html link on the head of and html file

Example:

  cap_utils.addLinkStyleToHTMLHead(host, [
      '<link href="https://fonts.googleapis.com/css?family=Roboto:300,400,500&display=optional" rel="stylesheet" async defer>',
      '<link href="https://fonts.googleapis.com/css?family=Open+Sans:300,300i,400,400i,600,600i,700,700i,800,800i&display=optional" rel="stylesheet" async defer>',
      '<link rel="stylesheet" href="https://stackpath.bootstrapcdn.com/font-awesome/4.7.0/css/font-awesome.min.css" async defer>'
    ], path)

addRoutes

@return

Example:

astUtils.addRoutes(host, filePath, [
  { path: '', pathMatch: 'full', component: 'HomeComponent' },
  { path: 'home', pathMatch: 'full', component: 'HomeComponent' }
], importUrl)

addBodyClass

Adds a class to the body of the document.

@return

Example:

addEnvironmentVar

Appends a key: value on a specific environment file.

RoutePaths' interface | Property | Description | |--------------|:---------------------:| | env | The environment to be added (example: prod, staging...)| | appPath | application path (/src...) | | key | The key to be added | | value | The value to be added |

@return void

Example:

cap_utils.addEnvironmentVar(host, [
      {
        env: '',
        appPath: options.path || '/src',
        key: 'apiUrl',
        value: 'http://localhost:4000/api/'
      },
      {
        env: 'prod',
        appPath: options.path || '/src',
        key: 'apiUrl',
        value: 'http://mydomain.com/api/'
      }
    ])

addExportToModule

Custom function to insert an export into NgModule. It also imports it.

@return

Example:

addEntryComponentToModule

Custom function to insert an entryComponent into NgModule. It also imports it.

@return

Example:

addPackageToPackageJson

Package interface(packageI)

@return

Example:

export function addPackageJsonDependencies(): Rule {
  return (host: Tree) => {
    cap_utilities.addPackageToPackageJson(host, [
      {
        type: NodeDependencyType.Default,
        pkg: 'cap-storage-aws',
        version: '~3.0.3'
      },
      {
        type: NodeDependencyType.Default,
        pkg: 'aws-sdk',
        version: '~2.701.0'
      },
      {
        type: NodeDependencyType.Default,
        pkg: 'ngx-file-drop',
        version: '~9.0.1'
      },
      {
        type: NodeDependencyType.Default,
        pkg: 'sweetalert2',
        version: '~9.15.1'
      },{
        type: NodeDependencyType.Default,
        pkg: 'uuid',
        version: '~8.1.0'
      }
    ])
    // cap_utilities.addPackageToPackageJson(host, NodeDependencyType.Default, 'cap-storage-aws', '~3.0.3')
    return host;
  };
}

addToNgModule

Add modules, components or services into the declaration module.

Note: If you wanna include a module with the method forRoot into the app module, intance of write the path of the module write the name of the module(link npm import).

importElementsModule' interface

forRootValuesI

forRootParamsI

@return

Example:

  astUtils.addToNgModule(host, options, [{
      name: 'HeaderComponent',
      path: 'app/header/header.component',
      type: 'component'
    },
    {
      name: 'FooterComponent',
      path: 'app/footer/footer.component',
      type: 'component'
    },
    {
      name: 'HomeModule',
      path: 'app/home/home.module',
      type: 'module'
    },
    {
      name: 'CapStorageAWS',
      path: 'cap-storage-aws',
      type: 'module',
      forRootValues: [
          {
            name: 'bucket',
            value: `my-credentials`
          },
          {
            name: 'accessKeyId',
            value: `my-credentials`
          },
          {
            name: 'secretAccessKey',
            value: `my-credentials`
          },
          {
            name: 'region',
            value: `my-credentials`
          },
          {
            name: 'folder',
            value: `my-credentials`
          }
        ]
      }]
    }]);

appendToStartFile

Appends a fragment to the start file.

@return A tree with the updates.

Example:

  const mainDiv =
  `<div id="main">
    <router-outlet></router-outlet>
  </div>`;
  astUtils.appendToStartFile(host, filePath, mainDiv);
    
  const content = `<app-header></app-header>` ;
  astUtils.appendToStartFile(host, filePath, content);

appendHtmlElementToBody

Appends the given element HTML fragment to the <body> element of the specified HTML file.

@return

Example:

getAppName

@return

Example:

getAppModulePath

@return

Example:

getAngularAppConfig

@return

Example:

getAppNameFromPackageJSON

@return

Example:

hasBootstrap

@return

Example:

isAngularBrowserProject

@return

Example:

readIntoSourceFile

@return

Example:

removeContentFromFile

Remove content from specified file

@return The updated tree.

Example:

function removeComponentHtml(filePath: string): Rule {
  return (hostd: Tree) => {
    astUtils.removeContentFromFile(host, filePath);
    return host;
  };
}

updateIndexFile

@return

Example:

updateIndexHeadFile

Appends the given element HTML fragment to the <head> element of the specified HTML file.

@return

Example:

updateBodyOfIndexFile

@return

Example:

addIdToElement

Add a id to a element on a html file

Example:

  function addIdAppToBody(htmlFilePath: string): Rule {
    return (host: Tree) => {
      addIdToElement(host, htmlFilePath, 'app', 'body');
    }
}*/

addToAngularJSONArchitectBudgets

Modify the budgets object within the Architect property of the Angular JSON File

Example:

  cap_utilities.addToAngularJSONArchitectBudgets(host, {
    type: 'anyComponentStyle',
    maximumWarning: '40kb',
    maximumError: '50kb'
  }

License

Apache-2.0 © Software Allies