The workspace does not have the 'production' configuration set up - Angular

Encountering an error in my Angular application while running ng serve --prod on Windows 10.

An unhandled exception occurred: Configuration 'production' is not set in the workspace.      
See "C:\Users\User\AppData\Local\Temp\ng-vzzrhY\angular-errors.log" for more details.

The angular-error.log file contains the following information:

[error] Error: Configuration 'production' is not set in the workspace.
    at Object.getOptions (D:\ProjectPath\node_modules\@angular-devkit\architect\node\node-modules-architect-host.js:47:31)
    at WorkspaceNodeModulesArchitectHost.getOptionsForTarget (D:\ProjectPath\node_modules\@angular-devkit\architect\node\node-modules-architect-host.js:126:49)
    ...

Here is a snippet from my Angular.json file

{
  "$schema": "./node_modules/@angular/cli/lib/config/schema.json",
  "version": 1,
  "newProjectRoot": "projects",
  "projects": {
"Project1": {
  "projectType": "application",
  "schematics": {},
  ...
      }
    },
    ...
  },
  "defaultProject": "Project1",
  "cli": {
    "analytics": "8062720d-180a-4964-84ea-93f7438a70dd"
  }
}

Received guidance from this Stack Overflow thread but issue still persists: An unhandled exception occurred: Configuration 'production' is not set in the workspace

How can I resolve this error?

angulartypescript

Answer №1

It appears that your serve configurations do not include a production configuration.

  "serve": {
      "builder": "@angular-devkit/build-angular:dev-server",
      "disableHostCheck": true,
      "options": {
        "browserTarget": "Project1:build"
      },
      "configurations": {
        "fr": { "browserTarget": "qwikCollaborator:build:fr" },
        "en": {"browserTarget": "qwikCollaborator:build:en" } 
        }       
    },

In the serve block, you currently have configurations for fr and en. To add a production configuration, modify as follows:

      "configurations": {
        "fr": { "browserTarget": "qwikCollaborator:build:fr" },
        "en": {"browserTarget": "qwikCollaborator:build:en" },
        "production": {"browserTarget": "qwikCollaborator:build:production" } 
        }

This change will enable the production builder to run successfully.

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

Error: The function webpackMerge.strategy does not exist

I've been in the process of updating an older Angular project to the latest version of Angular. However, I'm encountering a problem when trying to build, and I'm unsure why this is happening. Below is the error message that I've receiv ...

angularwebpackdependencies

Expanding current attributes within @types declarations

I want to enhance the Request object provided by express with additional data stored in the session. I attempted to create my own typings file (d.ts) and wrote this code snippet: import * as express from 'express'; declare module 'express ...

typescripttypescript-typings

Example of TypeScript Ambient Namespace Usage

The Namespaces chapter provides an example involving D3.d.ts that I find puzzling. Here is the complete example: declare namespace D3 { export interface Selectors { select: { (selector: string): Selection; (element: ...

typescriptnamespacesambient

A detailed guide on preserving session in Angular 4: a step-by-step approach

I am a beginner with Angular 4 and I'm unsure of how to implement session functionality. Can someone please explain the step-by-step process of implementing this feature in Angular 4, including where to write the necessary code? Below is an example co ...

angular

Retrieving the types of all ids from an object

I have a collection as follows: var myData = [{ id: 'a', value: 1}, { id: 'b', value: 2 }, { id: 'c', value: 3}] and I am trying to create a function that only accepts certain ids as parameters function checkId(id: 'a&ap ...

typescript

Displaying nested objects within an object using React

Behold this interesting item: const [object, setObject] = useState ({ item1: "Greetings, World!", item2: "Salutations!", }); I aim to retrieve all the children from it. I have a snippet of code here, but for some reason, i ...

javascriptreactjstypescriptnext.js

"When rendering an Angular Material table, how to navigate to the next or previous row efficiently

<ng-container cdkColumnDef="weight"> <th cdk-header-cell *cdkHeaderCellDef> Weight </th> <td cdk-cell *cdkCellDef="let element"> {{element.weight}} </td> </ng-container> How can I show the rolling weight total by ad ...

angularangular-material2angular-material-table

Guide on filtering FlatList Data in react native by selecting multiple categories from an array

User Interface Image I am looking to implement a filter functionality in the FlatList data based on top categories, where the filter button allows for multiple selections. The FlatList data is stored in the HotelData array, and the categories are also re ...

reactjstypescriptreact-nativereact-hooksreact-redux

Transmit information between components through a form

Is there a way to transfer data from one component to another in Angular? I have two components set up and I am currently using a selector to display the HTML content in the first component. Now, I need to figure out how to send the data entered in a form ...

angulartypescript

Exploring the Concept of Constructor Interfaces in TypeScript

I need some help with understanding constructor interfaces in TypeScript. I am new to this concept and I'm struggling to grasp how they are type checked. Let's take a look at an example from the documentation: interface ClockConstructor { ne ...

javascriptinterfacetypescript

Ways to incorporate environment variable in import statement?

In my Angular v5 project, I have a situation where I need to adjust the import path based on the environment. For example, I have an OwnedSetContractABI file located in different folders for each environment - dev and production. In dev environment, the ...

angulartypescriptenvironment-variables

Running a desktop Word AddIn using Angular 11.0.5 on MS Office 2016: A Step-by-Step Guide

I am facing an issue with loading my add-ins in the Office desktop version, although it works fine on the online platform. I initially developed the AddIn using Angular 5.2.11 and it worked perfectly. However, after upgrading to Angular 11.0.5, the Add-in ...

angularoffice-jsoffice-addins

BrowserRouter - The type '{ children: Element; }' is not compatible with the type 'IntrinsicAttributes', as they do not share any properties in common

After upgrading to React version 18, I encountered a type error with the BrowserRouter component. Despite trying various approaches, I am unable to pinpoint the root of the problem. Here is the error that pops up during debugging: Overload 1 of 2, &a ...

reactjstypescriptreact-routerreact-router-domreact-typescript

angular2-seed-advanced encountered an error: RangeError - The maximum call stack size has been exceeded

Attempting to launch the angular-seed-advanced project without modifications on various platforms has been successful for web and desktop (Linux/Windows). However, when trying to run it on Android (emulator and actual device), the following error occurred: ...

angularangular2-nativescriptangular2-seed

Not all generic types specified with an extends clause are appropriately narrowed down as expected

Consider the following scenario: type MyType = 'val1' | 'val2' | 'val3'; const variable = 'val1' as MyType; const val2 = 'val2'; const val3 = 'val3'; declare function test<U extends MyType&g ...

typescriptgenerics

Angular version 2 and above pipe as well as material tooltip

Seeking recommendations... I have a model: [{value:n, user:userId}], where value can be 0,1,2, etc... Initially, the client was receiving an array with objects like {value: 0, user: A}, {value: 1, user: B}, {value: 0, user: C}. I wanted to consolidate t ...

angular

Access an Angular 2 component through an email hyperlink including querystring parameters

I need to create a deep link with query string parameters for a component, so that when the link is clicked, it opens up the component in the browser. For example: exmaple.com/MyComponent?Id=10 I want to include a link in an email that will open the com ...

angulartypescript

What is the best way to ensure the footer remains in an automatic position relative to the component's height?

I am struggling to position the footer component correctly at the end of my router-outlet. After trying various CSS properties, I managed to make the footer stay at the bottom but it acts like a fixed footer. However, I want the footer to adjust its positi ...

htmlcssangularangular-material

What is the process for unsubscribing through an HTTP post request within an Angular application

There is a POST API set up through API Gateway on AWS, but it seems to be returning an infinite loop of arrays, as shown in the image below. How can I make it return just one array? Multiple requests Below is the code snippet: Angular import { Componen ...

angulartypescriptapisubscriptionunsubscribe

Passing data from a container component to a Redux Form component in React with TypeScript

One of my Form container components looks like this: class PersonalDetailContainer extends React.Component<PropTypes> { onSubmit = async (fields: PersonalFields) => { this.props.savePersonalDetail(fields); }; render(): JSX.Element { ...

reactjstypescriptredux-formreact-props