Cómo agregar / configurar el archivo Angular 6 angular.json de entorno

Solución:

Abra el archivo angular.json. Podemos ver las configuraciones de forma predeterminada que se mostrará para la producción agregue un fragmento de código para sus respectivos entornos. agregue el archivo environment.dev.ts en environment para dev, agregue environment.qa.ts para qa. Nombra como prefieras. usar

 ng serve --configuration=environment_name

environment_name – (dev, qa, prod) se puede seguir el mismo proceso para ng build

"configurations": {
        "production": {
          "fileReplacements": [
            {
              "replace": "src/environments/environment.ts",
              "with": "src/environments/environment.prod.ts"
            }
          ],
          "optimization": true,
          "outputHashing": "all",
          "sourceMap": false,
          "extractCss": true,
          "namedChunks": false,
          "aot": true,
          "extractLicenses": true,
          "vendorChunk": false,
          "buildOptimizer": true
        },
        "dev": {
          "fileReplacements": [
            {
              "replace": "src/environments/environment.ts",
              "with": "src/environments/environment.dev.ts"
            }
          ],
          "optimization": true,
          "outputHashing": "all",
          "sourceMap": true,
          "extractCss": true,
          "namedChunks": false,
          "aot": true,
          "extractLicenses": true,
          "vendorChunk": false,
          "buildOptimizer": true
        },
        "qa": {
          "fileReplacements": [
            {
              "replace": "src/environments/environment.ts",
              "with": "src/environments/environment.qa.ts"
            }
          ],
          "optimization": true,
          "outputHashing": "all",
          "sourceMap": false,
          "extractCss": true,
          "namedChunks": false,
          "aot": true,
          "extractLicenses": true,
          "vendorChunk": false,
          "buildOptimizer": true
        }
      }

Intenté la respuesta para agregar una nueva ‘prueba’ de configuración en mi aplicación Angular 6, luego ejecuté

ng serve --configuration=test

Y obtuvo un error que decía que la ‘prueba de configuración’ ‘no se pudo encontrar en el proyecto’. Mire hacia abajo en el archivo angular.json y hay otra sección bajo “compilación” que se llama “servir”. La nueva configuración debe agregarse a la sección de configuración en “servir” también para que ng serve funcione con ella:

"serve": {
      "builder": "@angular-devkit/build-angular:dev-server",
      "options": {
        "browserTarget": "my-app:build"
      },
      "configurations": {
        "production": {
          "browserTarget": "my-app:build:production"
        },
        "test": {
          "browserTarget": "my-app:build:test"
        }
      }
    },

Para configurar los entornos correctamente, debemos informar a Angular agregándolos al archivo de configuración angular.json. Haremos esto extendiendo el objeto de configuraciones:

... // angular.json
configurations": {
    "production" {...} // leave as it is,
    "dev": {
        "fileReplacements": [
            {
                "replace": "src/environments/environment.ts",
                "with": "src/environments/environment.dev.ts"
            }
        ]
    }
}

Y luego, tendrá que actualizar el objeto de servicio:

"serve": {
    "builder": "@angular-devkit/build-angular:dev-server",
    "options": {
        "browserTarget": "<appname>:build"
    },
    "configurations": {
        "production": ... // leave as it is
        "dev": {
            "browserTarget": "<appname>:build:dev"
        }
    }
},

crear un archivo de entorno más con environment.dev.ts bajo la src/environment/ directorio

y ejecuta el siguiente comando

ng serve -c=dev

también puede crear un comando para ejecutar este entorno por separado agregando el código a continuación en package.json

"scripts": {
   "start:dev": "ng serve -c=dev --port=4000"
   }
}

Aquí vamos

npm run start:dev

---

---

Utiliza Nuestro Buscador