Exclude entry point file from build process in Angular 2 tsconfig

I've encountered an issue with my Angular2 library project where the test.ts file is being included in the build, causing errors in Webstorm when decorators are used. The issue arises from the inclusion of both entry files (index.ts and test.ts) in my tsconfig.json. Is there a way to configure the IDE to use tsconfig.json for testing files but exclude them from the build process?

// tsconfig.json

{
  "compilerOptions": {
    "baseUrl": ".",
    "declaration": true,
    ... 
    ...
  },
  "files": [
    "index.ts",
    "test.ts"
  ],
  "angularCompilerOptions": {
    "strictMetadataEmit": true
  }
}

*Here are the build scripts for reference:

// package.json

...
"scripts": {
    "cleanup": "rimraf dist/bundles dist/src dist/index.d.ts dist/index.js dist/index.js.map dist/LICENCE dist/README.md",
    "bundling": "rollup -c",
    "minify": "uglifyjs dist/bundles/my-library.umd.js --screw-ie8 --compress --mangle --comments --output dist/bundles/async-local-storage.umd.min.js",
    "copy": "copyfiles LICENSE README.md dist",
    "build": "npm run cleanup && ngc && npm run bundling && npm run minify && npm run copy"
}
...

Answer №1

The issue was resolved by introducing a new configuration file for TypeScript, named tsconfig.build.json, and adjusting the build script to utilize this file:

"build": "npm run cleanup && ngc -p tsconfig.build.json && npm run bundling && npm run minify && npm run copy"

Similar questions

If you have not found the answer to your question or you are interested in this topic, then look at other similar questions below or use the search

I am facing an issue with TypeScript as it is preventing me from passing the prop in React and Zustand

interface ArticuloCompra { id: string; cantidad: number; titulo: string; precio: number; descuento: number; descripcion: string; imagen: string; } const enviarComprasUsuarios = ({ grupos, }: { grupos: { [key: string]: ArticuloCompra & ...

Develop a versatile factory using Typescript

For my current project, I am developing a small model system. I want to allow users of the library to define their own model for the API. When querying the server, the API should return instances of the user's model. // Library Code interface Instanc ...

A Typescript Function for Generating Scalable and Unique Identifiers

How can a unique ID be generated to reduce the likelihood of overlap? for(let i = 0; i < <Arbitrary Limit>; i++) generateID(); There are several existing solutions, but they all seem like indirect ways to address this issue. Potential Solu ...

Using TypeScript with material-ui enables the flexibility to accept props that are not explicitly defined in the

My current setup involves using React, material-ui, Flow, and Jest for snapshot testing. To ensure consistent snapshots, I found it necessary to explicitly define the ids in my material-ui components. Otherwise, the ids would be autogenerated and differ e ...

What is the best way to customize the styles of Material UI V5 Date Pickers?

Attempting to customize Mui X-Date-Pickers V5 through theme creation. This particular component is based on multiple layers. Interested in modifying the borderColor property, but it's currently set on the fieldset element, so need to navigate from Mu ...

Tips for exporting an array of dynamic JSON objects to CSV using Angular

I am facing a challenge in exporting an array of JSON objects to CSV as the number of key-value pairs can vary, leading to additional columns in some objects. Currently, I am using the Angular2CSV package for export functionality, but it requires all colum ...

Submitting sizable tiff documents using nodejs

I'm currently working on a web application with MEAN Stack and Angular 6. My challenge is uploading tiff files (maps) with large file sizes, up to 1.4 GB. I've tried using 'ng2fileUpload' and 'multer', but they are not compati ...

What methods are available to maximize the capabilities of Node's stream?

I've been attempting to develop a method for Readable Stream, but I quickly reached a point where I couldn't proceed any further. import * as stream from 'stream' //results in: Property 'asdasas' does not exist on type ' ...

Challenges with Spreading Props in TextField Component After MUIv4 Upgrade with TypeScript

Latest Material-UI Version: 4.1.0 I'm encountering difficulties in passing props to an abstracted <TextField /> component that I've developed. Below is the snippet of code: PasswordInput.tsx import * as React from 'react' impo ...

What is the best way to show the character count for every input in an Angular application?

In my app component, I have two input fields. I want to display the character count and max character limit for each input field dynamically as users type or blur on the input field. To achieve this, I created a component that shows and hides the characte ...

Understanding the NavigationContainer reference in Typescript and react-navigation

In my current project with react-navigation, I've come across a scenario where I need to navigate from outside of a component (specifically after receiving a push notification). The challenge is that when I use the navigation.navigate method from wit ...

Learn the process of automatically copying SMS message codes to input fields in Angular17

After receiving the first answer, I made some changes to the code. However, when testing it with Angular, I encountered several errors. How can I resolve these issues? TS: async otpRequest() { if ('OTPCredential' in window) { const ab ...

Is there a way to receive a ContentChild event without connecting it through the template?

Is there a way to listen for an event from an array of tab components without having to manually add the event listener for each component in the template? I have tabs that emit "onMinimized" events and I would like to streamline the process. In the paren ...

Awaiting server token before executing HttpInterceptor in Angular 2+

I understand that a similar question may have been asked before, but after going through all the available resources, I am still unable to find a solution to my problem. My issue lies in the fact that HttpIntercept.intercept needs to return next.handle(re ...

Enabling Cross-Origin Resource Sharing for Angular Client

Despite having CORS enabled on the server and functioning properly, I encountered a CORS error when attempting to send requests to my server's REST API using the Angular HTTPClient. Why is this error occurring if CORS is already enabled on the server? ...

oidc-client-js failing to display all profile claims that are supported by oidc-client-js

When setting up UserManager on the oidc-client-ts TypeScript module using the config object below: var config = { authority: "https://localhost:3000", client_id: "js", redirect_uri: "https://localhost:3001/callback.ht ...

Leverage Springs with TypeScript

function createDefaultOrder(items: any[]): number[] { return items.map((_, index) => index); } type CustomHandler<T> = (index: number) => T; type CustomValues = { zIndex: number, y: number, scale: number, shadow: number, immediate: ...

solving unique errors using custom Angular directives

As I have been learning, I have discovered that validation errors in HTML are common, but I am curious about how to return custom errors. Below is a directive example: @Directive({ selector: '[verifySalaryUp]', // Attribute selector provider ...

Testing Material-UI's autocomplete with React Testing Library: a step-by-step guide

I am currently using the material-ui autocomplete component and attempting to test it with react-testing-library. Component: /* eslint-disable no-use-before-define */ import TextField from '@material-ui/core/TextField'; import Autocomplete from ...

Parent composition failing to receive emissions from Vue3 child component

Recently started learning vue and exploring event handling between Children and Parents. I've developed a child component with an emit exposed in the script setup: const emit = defineEmits(['OnTileClicked']) function TileClicked() { ...