Huge News!Announcing our $40M Series B led by Abstract Ventures.Learn More →
Socket
Sign inDemoInstall
Socket
Sign inDemoInstall

@stencil/angular-output-target

Package Overview
Dependencies
Maintainers
2
Versions
103
Alerts
File Explorer

Advanced tools

License
Socket logo

Install Socket

Detect and block malicious and high-risk dependencies

Install

@stencil/angular-output-target - npm Package Compare versions

Comparing version 0.8.1-dev.11690825475.1243803f to 0.8.1

4

dist/generate-angular-component.d.ts
import type { ComponentCompilerEvent } from '@stencil/core/internal';
import type { OutputType } from './types';
/**

@@ -16,2 +17,3 @@ * Creates an Angular component declaration from formatted Stencil compiler metadata.

* Creates the component interface type definition.
* @param outputType The output type.
* @param tagNameAsPascal The tag name as PascalCase.

@@ -23,2 +25,2 @@ * @param events The events to generate the interface properties for.

*/
export declare const createComponentTypeDefinition: (tagNameAsPascal: string, events: readonly ComponentCompilerEvent[], componentCorePackage: string, customElementsDir?: string | undefined) => string;
export declare const createComponentTypeDefinition: (outputType: OutputType, tagNameAsPascal: string, events: readonly ComponentCompilerEvent[], componentCorePackage: string, customElementsDir?: string | undefined) => string;

4

dist/generate-angular-component.js

@@ -106,2 +106,3 @@ import { createComponentEventTypeImports, dashToPascalCase, formatToQuotedList } from './utils';

* Creates the component interface type definition.
* @param outputType The output type.
* @param tagNameAsPascal The tag name as PascalCase.

@@ -113,3 +114,3 @@ * @param events The events to generate the interface properties for.

*/
export const createComponentTypeDefinition = (tagNameAsPascal, events, componentCorePackage, customElementsDir) => {
export const createComponentTypeDefinition = (outputType, tagNameAsPascal, events, componentCorePackage, customElementsDir) => {
const publicEvents = events.filter((ev) => !ev.internal);

@@ -119,2 +120,3 @@ const eventTypeImports = createComponentEventTypeImports(tagNameAsPascal, publicEvents, {

customElementsDir,
outputType,
});

@@ -121,0 +123,0 @@ const eventTypes = publicEvents.map((event) => {

76

dist/index.cjs.js

@@ -12,2 +12,7 @@ 'use strict';

const OutputTypes = {
Component: 'component',
Scam: 'scam',
Standalone: 'standalone',
};
const toLowerCase = (str) => str.toLowerCase();

@@ -105,2 +110,10 @@ const dashToPascalCase = (str) => toLowerCase(str)

/**
* Checks if the outputType is for the custom elements build.
* @param outputType The output type.
* @returns `true` if the output type is for the custom elements build.
*/
const isOutputTypeCustomElementsBuild = (outputType) => {
return outputType === OutputTypes.Standalone || outputType === OutputTypes.Scam;
};
/**
* Creates the collection of import statements for a component based on the component's events type dependencies.

@@ -116,3 +129,3 @@ * @param componentTagName The tag name of the component (pascal case).

const namedImports = new Set();
const isCustomElementsBuild = customElementsDir !== undefined;
const isCustomElementsBuild = isOutputTypeCustomElementsBuild(options.outputType);
const importPathName = normalizePath(componentCorePackage) + (isCustomElementsBuild ? `/${customElementsDir}` : '');

@@ -241,2 +254,3 @@ events.forEach((event) => {

* Creates the component interface type definition.
* @param outputType The output type.
* @param tagNameAsPascal The tag name as PascalCase.

@@ -248,3 +262,3 @@ * @param events The events to generate the interface properties for.

*/
const createComponentTypeDefinition = (tagNameAsPascal, events, componentCorePackage, customElementsDir) => {
const createComponentTypeDefinition = (outputType, tagNameAsPascal, events, componentCorePackage, customElementsDir) => {
const publicEvents = events.filter((ev) => !ev.internal);

@@ -254,2 +268,3 @@ const eventTypeImports = createComponentEventTypeImports(tagNameAsPascal, publicEvents, {

customElementsDir,
outputType,
});

@@ -402,7 +417,7 @@ const eventTypes = publicEvents.map((event) => {

const dtsFilePath = path__default['default'].join(rootDir, distTypesDir, GENERATED_DTS);
const { outputType } = outputTarget;
const componentsTypeFile = relativeImport(outputTarget.directivesProxyFile, dtsFilePath, '.d.ts');
const includeSingleComponentAngularModules = outputTarget.outputType === 'scam';
const includeSingleComponentAngularComponents = outputTarget.outputType === 'standalone';
const isCustomElementsBuild = outputTarget.customElementsDir !== undefined;
const isStandaloneBuild = outputTarget.outputType === 'standalone';
const includeSingleComponentAngularModules = outputType === OutputTypes.Scam;
const isCustomElementsBuild = isOutputTypeCustomElementsBuild(outputType);
const isStandaloneBuild = outputType === OutputTypes.Standalone;
const includeOutputImports = components.some((component) => component.events.some((event) => !event.internal));

@@ -449,5 +464,5 @@ /**

* Build an array of Custom Elements build imports and namespace them
* so that they do not conflict with the React wrapper names. For example,
* so that they do not conflict with the Angular wrapper names. For example,
* IonButton would be imported as IonButtonCmp so as to not conflict with the
* IonButton React Component that takes in the Web Component as a parameter.
* IonButton Angular Component that takes in the Web Component as a parameter.
*/

@@ -461,12 +476,2 @@ if (isCustomElementsBuild && outputTarget.componentCorePackage !== undefined) {

}
if (!isCustomElementsBuild) {
if (includeSingleComponentAngularModules) {
// Generating Angular modules is only supported in the dist-custom-elements build
throw new Error('Generating single component Angular modules requires the "customElementsDir" option to be set.');
}
if (includeSingleComponentAngularComponents) {
// Generates Angular standalone components is only supported in the dist-custom-elements build
throw new Error('Generating standalone Angular components requires the "customElementsDir" option to be set.');
}
}
const proxyFileOutput = [];

@@ -502,3 +507,3 @@ const filterInternalProps = (prop) => !prop.internal;

const moduleDefinition = generateAngularModuleForComponent(cmpMeta.tagName);
const componentTypeDefinition = createComponentTypeDefinition(tagNameAsPascal, cmpMeta.events, componentCorePackage, customElementsDir);
const componentTypeDefinition = createComponentTypeDefinition(outputType, tagNameAsPascal, cmpMeta.events, componentCorePackage, customElementsDir);
proxyFileOutput.push(componentDefinition, '\n');

@@ -516,16 +521,19 @@ if (includeSingleComponentAngularModules) {

const angularOutputTarget = (outputTarget) => ({
type: 'custom',
name: 'angular-library',
validate(config) {
return normalizeOutputTarget(config, outputTarget);
},
async generator(config, compilerCtx, buildCtx) {
const timespan = buildCtx.createTimeSpan(`generate angular proxies started`, true);
await angularDirectiveProxyOutput(compilerCtx, outputTarget, buildCtx.components, config);
timespan.finish(`generate angular proxies finished`);
},
});
const angularOutputTarget = (outputTarget) => {
let validatedOutputTarget;
return {
type: 'custom',
name: 'angular-library',
validate(config) {
validatedOutputTarget = normalizeOutputTarget(config, outputTarget);
},
async generator(config, compilerCtx, buildCtx) {
const timespan = buildCtx.createTimeSpan(`generate angular proxies started`, true);
await angularDirectiveProxyOutput(compilerCtx, validatedOutputTarget, buildCtx.components, config);
timespan.finish(`generate angular proxies finished`);
},
};
};
function normalizeOutputTarget(config, outputTarget) {
const results = Object.assign(Object.assign({}, outputTarget), { excludeComponents: outputTarget.excludeComponents || [], valueAccessorConfigs: outputTarget.valueAccessorConfigs || [] });
const results = Object.assign(Object.assign({}, outputTarget), { excludeComponents: outputTarget.excludeComponents || [], valueAccessorConfigs: outputTarget.valueAccessorConfigs || [], customElementsDir: outputTarget.customElementsDir || 'components', outputType: outputTarget.outputType || OutputTypes.Component });
if (config.rootDir == null) {

@@ -546,4 +554,4 @@ throw new Error('rootDir is not set and it should be set by stencil itself');

}
if (outputTarget.outputType === 'scam') {
console.warn('**Experimental**: outputType: "scam" is a developer preview feature and may change or be removed in the future.');
if (outputTarget.outputType === OutputTypes.Scam) {
console.warn(`**Experimental**: outputType: "${OutputTypes.Scam}" is a developer preview feature and may change or be removed in the future.`);
}

@@ -550,0 +558,0 @@ return results;

76

dist/index.js
import path from 'path';
import { EOL } from 'os';
const OutputTypes = {
Component: 'component',
Scam: 'scam',
Standalone: 'standalone',
};
const toLowerCase = (str) => str.toLowerCase();

@@ -96,2 +101,10 @@ const dashToPascalCase = (str) => toLowerCase(str)

/**
* Checks if the outputType is for the custom elements build.
* @param outputType The output type.
* @returns `true` if the output type is for the custom elements build.
*/
const isOutputTypeCustomElementsBuild = (outputType) => {
return outputType === OutputTypes.Standalone || outputType === OutputTypes.Scam;
};
/**
* Creates the collection of import statements for a component based on the component's events type dependencies.

@@ -107,3 +120,3 @@ * @param componentTagName The tag name of the component (pascal case).

const namedImports = new Set();
const isCustomElementsBuild = customElementsDir !== undefined;
const isCustomElementsBuild = isOutputTypeCustomElementsBuild(options.outputType);
const importPathName = normalizePath(componentCorePackage) + (isCustomElementsBuild ? `/${customElementsDir}` : '');

@@ -232,2 +245,3 @@ events.forEach((event) => {

* Creates the component interface type definition.
* @param outputType The output type.
* @param tagNameAsPascal The tag name as PascalCase.

@@ -239,3 +253,3 @@ * @param events The events to generate the interface properties for.

*/
const createComponentTypeDefinition = (tagNameAsPascal, events, componentCorePackage, customElementsDir) => {
const createComponentTypeDefinition = (outputType, tagNameAsPascal, events, componentCorePackage, customElementsDir) => {
const publicEvents = events.filter((ev) => !ev.internal);

@@ -245,2 +259,3 @@ const eventTypeImports = createComponentEventTypeImports(tagNameAsPascal, publicEvents, {

customElementsDir,
outputType,
});

@@ -393,7 +408,7 @@ const eventTypes = publicEvents.map((event) => {

const dtsFilePath = path.join(rootDir, distTypesDir, GENERATED_DTS);
const { outputType } = outputTarget;
const componentsTypeFile = relativeImport(outputTarget.directivesProxyFile, dtsFilePath, '.d.ts');
const includeSingleComponentAngularModules = outputTarget.outputType === 'scam';
const includeSingleComponentAngularComponents = outputTarget.outputType === 'standalone';
const isCustomElementsBuild = outputTarget.customElementsDir !== undefined;
const isStandaloneBuild = outputTarget.outputType === 'standalone';
const includeSingleComponentAngularModules = outputType === OutputTypes.Scam;
const isCustomElementsBuild = isOutputTypeCustomElementsBuild(outputType);
const isStandaloneBuild = outputType === OutputTypes.Standalone;
const includeOutputImports = components.some((component) => component.events.some((event) => !event.internal));

@@ -440,5 +455,5 @@ /**

* Build an array of Custom Elements build imports and namespace them
* so that they do not conflict with the React wrapper names. For example,
* so that they do not conflict with the Angular wrapper names. For example,
* IonButton would be imported as IonButtonCmp so as to not conflict with the
* IonButton React Component that takes in the Web Component as a parameter.
* IonButton Angular Component that takes in the Web Component as a parameter.
*/

@@ -452,12 +467,2 @@ if (isCustomElementsBuild && outputTarget.componentCorePackage !== undefined) {

}
if (!isCustomElementsBuild) {
if (includeSingleComponentAngularModules) {
// Generating Angular modules is only supported in the dist-custom-elements build
throw new Error('Generating single component Angular modules requires the "customElementsDir" option to be set.');
}
if (includeSingleComponentAngularComponents) {
// Generates Angular standalone components is only supported in the dist-custom-elements build
throw new Error('Generating standalone Angular components requires the "customElementsDir" option to be set.');
}
}
const proxyFileOutput = [];

@@ -493,3 +498,3 @@ const filterInternalProps = (prop) => !prop.internal;

const moduleDefinition = generateAngularModuleForComponent(cmpMeta.tagName);
const componentTypeDefinition = createComponentTypeDefinition(tagNameAsPascal, cmpMeta.events, componentCorePackage, customElementsDir);
const componentTypeDefinition = createComponentTypeDefinition(outputType, tagNameAsPascal, cmpMeta.events, componentCorePackage, customElementsDir);
proxyFileOutput.push(componentDefinition, '\n');

@@ -507,16 +512,19 @@ if (includeSingleComponentAngularModules) {

const angularOutputTarget = (outputTarget) => ({
type: 'custom',
name: 'angular-library',
validate(config) {
return normalizeOutputTarget(config, outputTarget);
},
async generator(config, compilerCtx, buildCtx) {
const timespan = buildCtx.createTimeSpan(`generate angular proxies started`, true);
await angularDirectiveProxyOutput(compilerCtx, outputTarget, buildCtx.components, config);
timespan.finish(`generate angular proxies finished`);
},
});
const angularOutputTarget = (outputTarget) => {
let validatedOutputTarget;
return {
type: 'custom',
name: 'angular-library',
validate(config) {
validatedOutputTarget = normalizeOutputTarget(config, outputTarget);
},
async generator(config, compilerCtx, buildCtx) {
const timespan = buildCtx.createTimeSpan(`generate angular proxies started`, true);
await angularDirectiveProxyOutput(compilerCtx, validatedOutputTarget, buildCtx.components, config);
timespan.finish(`generate angular proxies finished`);
},
};
};
function normalizeOutputTarget(config, outputTarget) {
const results = Object.assign(Object.assign({}, outputTarget), { excludeComponents: outputTarget.excludeComponents || [], valueAccessorConfigs: outputTarget.valueAccessorConfigs || [] });
const results = Object.assign(Object.assign({}, outputTarget), { excludeComponents: outputTarget.excludeComponents || [], valueAccessorConfigs: outputTarget.valueAccessorConfigs || [], customElementsDir: outputTarget.customElementsDir || 'components', outputType: outputTarget.outputType || OutputTypes.Component });
if (config.rootDir == null) {

@@ -537,4 +545,4 @@ throw new Error('rootDir is not set and it should be set by stencil itself');

}
if (outputTarget.outputType === 'scam') {
console.warn('**Experimental**: outputType: "scam" is a developer preview feature and may change or be removed in the future.');
if (outputTarget.outputType === OutputTypes.Scam) {
console.warn(`**Experimental**: outputType: "${OutputTypes.Scam}" is a developer preview feature and may change or be removed in the future.`);
}

@@ -541,0 +549,0 @@ return results;

26

dist/output-angular.js
import path from 'path';
import { relativeImport, normalizePath, sortBy, readPackageJson, dashToPascalCase, createImportStatement, } from './utils';
import { relativeImport, normalizePath, sortBy, readPackageJson, dashToPascalCase, createImportStatement, isOutputTypeCustomElementsBuild, OutputTypes, } from './utils';
import { createAngularComponentDefinition, createComponentTypeDefinition } from './generate-angular-component';

@@ -40,7 +40,7 @@ import { generateAngularDirectivesFile } from './generate-angular-directives-file';

const dtsFilePath = path.join(rootDir, distTypesDir, GENERATED_DTS);
const { outputType } = outputTarget;
const componentsTypeFile = relativeImport(outputTarget.directivesProxyFile, dtsFilePath, '.d.ts');
const includeSingleComponentAngularModules = outputTarget.outputType === 'scam';
const includeSingleComponentAngularComponents = outputTarget.outputType === 'standalone';
const isCustomElementsBuild = outputTarget.customElementsDir !== undefined;
const isStandaloneBuild = outputTarget.outputType === 'standalone';
const includeSingleComponentAngularModules = outputType === OutputTypes.Scam;
const isCustomElementsBuild = isOutputTypeCustomElementsBuild(outputType);
const isStandaloneBuild = outputType === OutputTypes.Standalone;
const includeOutputImports = components.some((component) => component.events.some((event) => !event.internal));

@@ -87,5 +87,5 @@ /**

* Build an array of Custom Elements build imports and namespace them
* so that they do not conflict with the React wrapper names. For example,
* so that they do not conflict with the Angular wrapper names. For example,
* IonButton would be imported as IonButtonCmp so as to not conflict with the
* IonButton React Component that takes in the Web Component as a parameter.
* IonButton Angular Component that takes in the Web Component as a parameter.
*/

@@ -99,12 +99,2 @@ if (isCustomElementsBuild && outputTarget.componentCorePackage !== undefined) {

}
if (!isCustomElementsBuild) {
if (includeSingleComponentAngularModules) {
// Generating Angular modules is only supported in the dist-custom-elements build
throw new Error('Generating single component Angular modules requires the "customElementsDir" option to be set.');
}
if (includeSingleComponentAngularComponents) {
// Generates Angular standalone components is only supported in the dist-custom-elements build
throw new Error('Generating standalone Angular components requires the "customElementsDir" option to be set.');
}
}
const proxyFileOutput = [];

@@ -140,3 +130,3 @@ const filterInternalProps = (prop) => !prop.internal;

const moduleDefinition = generateAngularModuleForComponent(cmpMeta.tagName);
const componentTypeDefinition = createComponentTypeDefinition(tagNameAsPascal, cmpMeta.events, componentCorePackage, customElementsDir);
const componentTypeDefinition = createComponentTypeDefinition(outputType, tagNameAsPascal, cmpMeta.events, componentCorePackage, customElementsDir);
proxyFileOutput.push(componentDefinition, '\n');

@@ -143,0 +133,0 @@ if (includeSingleComponentAngularModules) {

35

dist/plugin.js

@@ -1,18 +0,21 @@

import { normalizePath } from './utils';
import { OutputTypes, normalizePath } from './utils';
import { angularDirectiveProxyOutput } from './output-angular';
import path from 'path';
export const angularOutputTarget = (outputTarget) => ({
type: 'custom',
name: 'angular-library',
validate(config) {
return normalizeOutputTarget(config, outputTarget);
},
async generator(config, compilerCtx, buildCtx) {
const timespan = buildCtx.createTimeSpan(`generate angular proxies started`, true);
await angularDirectiveProxyOutput(compilerCtx, outputTarget, buildCtx.components, config);
timespan.finish(`generate angular proxies finished`);
},
});
export const angularOutputTarget = (outputTarget) => {
let validatedOutputTarget;
return {
type: 'custom',
name: 'angular-library',
validate(config) {
validatedOutputTarget = normalizeOutputTarget(config, outputTarget);
},
async generator(config, compilerCtx, buildCtx) {
const timespan = buildCtx.createTimeSpan(`generate angular proxies started`, true);
await angularDirectiveProxyOutput(compilerCtx, validatedOutputTarget, buildCtx.components, config);
timespan.finish(`generate angular proxies finished`);
},
};
};
export function normalizeOutputTarget(config, outputTarget) {
const results = Object.assign(Object.assign({}, outputTarget), { excludeComponents: outputTarget.excludeComponents || [], valueAccessorConfigs: outputTarget.valueAccessorConfigs || [] });
const results = Object.assign(Object.assign({}, outputTarget), { excludeComponents: outputTarget.excludeComponents || [], valueAccessorConfigs: outputTarget.valueAccessorConfigs || [], customElementsDir: outputTarget.customElementsDir || 'components', outputType: outputTarget.outputType || OutputTypes.Component });
if (config.rootDir == null) {

@@ -33,6 +36,6 @@ throw new Error('rootDir is not set and it should be set by stencil itself');

}
if (outputTarget.outputType === 'scam') {
console.warn('**Experimental**: outputType: "scam" is a developer preview feature and may change or be removed in the future.');
if (outputTarget.outputType === OutputTypes.Scam) {
console.warn(`**Experimental**: outputType: "${OutputTypes.Scam}" is a developer preview feature and may change or be removed in the future.`);
}
return results;
}

4

dist/types.d.ts

@@ -26,6 +26,6 @@ /**

* - `component` - Generate many component wrappers tied to a single Angular module (lazy/hydrated approach).
* - `scam` - @experimental Generate a Single Component Angular Module for each component.
* - `scam` - **Experimental** - Generate a Single Component Angular Module for each component.
* - `standalone` - Generate a component with the `standalone` flag set to `true`.
*/
outputType: OutputType;
outputType?: OutputType;
}

@@ -32,0 +32,0 @@ export declare type ValueAccessorTypes = 'text' | 'radio' | 'select' | 'number' | 'boolean';

12

dist/utils.d.ts
import { ComponentCompilerEvent, Config } from '@stencil/core/internal';
import type { PackageJSON } from './types';
import { OutputType, PackageJSON } from './types';
export declare const OutputTypes: {
[key: string]: OutputType;
};
export declare const toLowerCase: (str: string) => string;

@@ -25,2 +28,8 @@ export declare const dashToPascalCase: (str: string) => string;

/**
* Checks if the outputType is for the custom elements build.
* @param outputType The output type.
* @returns `true` if the output type is for the custom elements build.
*/
export declare const isOutputTypeCustomElementsBuild: (outputType: OutputType) => boolean;
/**
* Creates the collection of import statements for a component based on the component's events type dependencies.

@@ -35,2 +44,3 @@ * @param componentTagName The tag name of the component (pascal case).

customElementsDir?: string;
outputType: OutputType;
}) => string;

15

dist/utils.js
import path from 'path';
export const OutputTypes = {
Component: 'component',
Scam: 'scam',
Standalone: 'standalone',
};
export const toLowerCase = (str) => str.toLowerCase();

@@ -97,2 +102,10 @@ export const dashToPascalCase = (str) => toLowerCase(str)

/**
* Checks if the outputType is for the custom elements build.
* @param outputType The output type.
* @returns `true` if the output type is for the custom elements build.
*/
export const isOutputTypeCustomElementsBuild = (outputType) => {
return outputType === OutputTypes.Standalone || outputType === OutputTypes.Scam;
};
/**
* Creates the collection of import statements for a component based on the component's events type dependencies.

@@ -108,3 +121,3 @@ * @param componentTagName The tag name of the component (pascal case).

const namedImports = new Set();
const isCustomElementsBuild = customElementsDir !== undefined;
const isCustomElementsBuild = isOutputTypeCustomElementsBuild(options.outputType);
const importPathName = normalizePath(componentCorePackage) + (isCustomElementsBuild ? `/${customElementsDir}` : '');

@@ -111,0 +124,0 @@ events.forEach((event) => {

4

package.json
{
"name": "@stencil/angular-output-target",
"version": "0.8.1-dev.11690825475.1243803f",
"version": "0.8.1",
"description": "Angular output target for @stencil/core components.",

@@ -61,3 +61,3 @@ "main": "dist/index.cjs.js",

},
"gitHead": "243803f02d0675190181da7ed8ad6ff432c3ee1d",
"gitHead": "a3588e905186a0e86e7f88418fd5b2f9531b55e0",
"volta": {

@@ -64,0 +64,0 @@ "extends": "../../package.json"

5

README.md

@@ -30,3 +30,2 @@ # @stencil/angular-output-target

componentCorePackage: 'component-library',
outputType: 'component',
directivesProxyFile: '../component-library-angular/src/directives/proxies.ts',

@@ -52,3 +51,3 @@ directivesArrayFile: '../component-library-angular/src/directives/index.ts',

| `excludeComponents` | An array of tag names to exclude from generating component wrappers for. This is helpful when have a custom framework implementation of a specific component or need to extend the base component wrapper behavior. |
| `outputType` | Specifies the type of output to be generated. It can take one of the following values: <br />1. `component`: Generates all the component wrappers to be declared on an Angular module. This option is required for Stencil projects using the `dist` hydrated output.<br /> 2. `scam`: Generates a separate Angular module for each component.<br /> 3. `standalone`: Generates standalone component wrappers.<br /> Both `scam` and `standalone` options are compatible with the `dist-custom-elements` output. Developers **must** set a `customElementsDir` in the output target config when using either 'scam' or 'standalone'.<br />Note: Please choose the appropriate `outputType` based on your project's requirements and the desired output structure. |
| `customElementsDir` | This is the directory where the custom elements are imported from when using the [Custom Elements Bundle](https://stenciljs.com/docs/custom-elements). Required to be set for `outputType: "scam"` or `outputType: "standalone"`. |
| `outputType` | Specifies the type of output to be generated. It can take one of the following values: <br />1. `component`: Generates all the component wrappers to be declared on an Angular module. This option is required for Stencil projects using the `dist` hydrated output.<br /> 2. `scam`: Generates a separate Angular module for each component.<br /> 3. `standalone`: Generates standalone component wrappers.<br /> Both `scam` and `standalone` options are compatible with the `dist-custom-elements` output. <br />Note: Please choose the appropriate `outputType` based on your project's requirements and the desired output structure. Defaults to `component`. |
| `customElementsDir` | This is the directory where the custom elements are imported from when using the [Custom Elements Bundle](https://stenciljs.com/docs/custom-elements). Defaults to the `components` directory. Only applies for `outputType: "scam"` or `outputType: "standalone"`. |
SocketSocket SOC 2 Logo

Product

  • Package Alerts
  • Integrations
  • Docs
  • Pricing
  • FAQ
  • Roadmap
  • Changelog

About

Packages

npm

Go

Maven

PyPI

Rubygems

Stay in touch

Get open source security insights delivered straight into your inbox.

  • Terms
  • Privacy
  • Security

Made with ⚡️ by Socket Inc