Security News
JSR Working Group Kicks Off with Ambitious Roadmap and Plans for Open Governance
At its inaugural meeting, the JSR Working Group outlined plans for an open governance model and a roadmap to enhance JavaScript package management.
@angular-devkit/core
Advanced tools
The @angular-devkit/core package is a fundamental part of the Angular DevKit which provides utility functions and an abstraction layer for managing file systems and other common tasks needed in the development of Angular applications. It is designed to be used by the Angular CLI and other tools to enhance and streamline the development process.
Virtual File System
Allows manipulation of file systems in memory, which is useful for testing and build processes without affecting the actual file system.
{"import { virtualFs, HostTree } from '@angular-devkit/core';\nconst host = new HostTree();\nhost.create('/hello', 'world');\nconst exists = host.exists('/hello');\nconsole.log(exists); // true"}
Workspace Configuration
Provides utilities to read and manipulate Angular workspace configuration, enabling tools and scripts to modify project settings programmatically.
{"import { workspaces } from '@angular-devkit/core';\nasync function getWorkspace() {\n const workspaceHost = workspaces.createWorkspaceHost(host);\n const { workspace } = await workspaces.readWorkspace('/', workspaceHost);\n console.log(workspace.projects.get('my-app'));\n}"}
Schematics
Supports the creation and execution of schematics which are templates used to generate or transform projects. This feature is crucial for extending the Angular CLI's capabilities.
{"import { SchematicContext, Tree, Rule } from '@angular-devkit/schematics';\nfunction mySchematic(_options: any): Rule {\n return (tree: Tree, _context: SchematicContext) => {\n tree.create('hello.txt', 'Hello World');\n return tree;\n };\n}"}
Similar to the schematics functionality of @angular-devkit/core, Yeoman generators allow the creation of projects or parts of projects through templates. However, Yeoman is more generic and not Angular-specific.
Provides extended functionality for the Node.js file system module, similar to the virtual file system capabilities of @angular-devkit/core, but operates on the actual file system rather than a virtual one.
While primarily a module bundler, webpack offers a rich plugin interface that can perform similar tasks to those of @angular-devkit/core, such as manipulating files and project assets. However, it is more focused on the build process rather than project scaffolding or configuration.
Shared utilities for Angular DevKit.
export interface SchemaValidatorResult {
success: boolean;
errors?: string[];
}
export interface SchemaValidator {
(data: any): Observable<SchemaValidatorResult>;
}
export interface SchemaFormatter {
readonly async: boolean;
validate(data: any): boolean | Observable<boolean>;
}
export interface SchemaRegistry {
compile(schema: Object): Observable<SchemaValidator>;
addFormat(name: string, formatter: SchemaFormatter): void;
}
SchemaRegistry
implementation using https://github.com/epoberezkin/ajv.
Constructor accepts object containing SchemaFormatter
that will be added automatically.
export class CoreSchemaRegistry implements SchemaRegistry {
constructor(formats: { [name: string]: SchemaFormatter} = {}) {}
}
The workspaces
namespace provides an API for interacting with the workspace file formats.
It provides an abstraction of the underlying storage format of the workspace and provides
support for both reading and writing. Currently, the only supported format is the JSON-based
format used by the Angular CLI. For this format, the API provides internal change tracking of values which
enables fine-grained updates to the underlying storage of the workspace. This allows for the
retention of existing formatting and comments.
A workspace is defined via the following object model. Definition collection objects are specialized
Javascript Map
objects with an additional add
method to simplify addition and provide more localized
error checking of the newly added values.
export interface WorkspaceDefinition {
readonly extensions: Record<string, JsonValue | undefined>;
readonly projects: ProjectDefinitionCollection;
}
export interface ProjectDefinition {
readonly extensions: Record<string, JsonValue | undefined>;
readonly targets: TargetDefinitionCollection;
root: string;
prefix?: string;
sourceRoot?: string;
}
export interface TargetDefinition {
options?: Record<string, JsonValue | undefined>;
configurations?: Record<string, Record<string, JsonValue | undefined> | undefined>;
builder: string;
}
The API is asynchronous and has two main functions to facilitate reading, creation, and modifying
a workspace: readWorkspace
and writeWorkspace
.
export enum WorkspaceFormat {
JSON,
}
export function readWorkspace(
path: string,
host: WorkspaceHost,
format?: WorkspaceFormat,
): Promise<{ workspace: WorkspaceDefinition }>;
export function writeWorkspace(
workspace: WorkspaceDefinition,
host: WorkspaceHost,
path?: string,
format?: WorkspaceFormat,
): Promise<void>;
A WorkspaceHost
abstracts the underlying data access methods from the functions. It provides
methods to read, write, and analyze paths. A utility function is provided to create
an instance of a WorkspaceHost
from the Angular DevKit's virtual filesystem host abstraction.
export interface WorkspaceHost {
readFile(path: string): Promise<string>;
writeFile(path: string, data: string): Promise<void>;
isDirectory(path: string): Promise<boolean>;
isFile(path: string): Promise<boolean>;
}
export function createWorkspaceHost(host: virtualFs.Host): WorkspaceHost;
To demonstrate the usage of the API, the following code will show how to add a option property to a build target for an application.
import { NodeJsSyncHost } from '@angular-devkit/core/node';
import { workspaces } from '@angular-devkit/core';
async function demonstrate() {
const host = workspaces.createWorkspaceHost(new NodeJsSyncHost());
const { workspace } = await workspaces.readWorkspace('path/to/workspace/directory/', host);
const project = workspace.projects.get('my-app');
if (!project) {
throw new Error('my-app does not exist');
}
const buildTarget = project.targets.get('build');
if (!buildTarget) {
throw new Error('build target does not exist');
}
buildTarget.options.optimization = true;
await workspaces.writeWorkspace(workspace, host);
}
demonstrate();
FAQs
Angular DevKit - Core Utility Library
The npm package @angular-devkit/core receives a total of 6,518,178 weekly downloads. As such, @angular-devkit/core popularity was classified as popular.
We found that @angular-devkit/core demonstrated a healthy version release cadence and project activity because the last version was released less than a year ago. It has 2 open source maintainers collaborating on the project.
Did you know?
Socket for GitHub automatically highlights issues in each pull request and monitors the health of all your open source dependencies. Discover the contents of your packages and block harmful activity before you install or update your dependencies.
Security News
At its inaugural meeting, the JSR Working Group outlined plans for an open governance model and a roadmap to enhance JavaScript package management.
Security News
Research
An advanced npm supply chain attack is leveraging Ethereum smart contracts for decentralized, persistent malware control, evading traditional defenses.
Security News
Research
Attackers are impersonating Sindre Sorhus on npm with a fake 'chalk-node' package containing a malicious backdoor to compromise developers' projects.