Environment issue in Angular when try to build

Question

When I try to build an Angular project I have this issue :

File '/angular/src/environments/environment.ts' is not a module

I import the file like this :

import { environment } from '../../environments/environment';

My tsconfig.json :

{
  "compileOnSave": false,
  "compilerOptions": {
    "baseUrl": "./",
    "outDir": "./dist/out-tsc",
    "sourceMap": true,
    "declaration": false,
    "moduleResolution": "node",
    "emitDecoratorMetadata": true,
    "experimentalDecorators": true,
    "target": "es5",
    "typeRoots": [
      "node_modules/@types"
    ],
    "lib": [
      "es2017",
      "dom"
    ]
  }
}

In my environment folder I have files: environment.ts, environment.prod.ts, environment.dev.ts.

I use NODE_VERSION=10, NG_CLI_VERSION=8

My angular.json, the build.configurations for dev :

"dev": {
          "optimization": true,
          "outputHashing": "all",
          "sourceMap": false,
          "extractCss": true,
          "namedChunks": false,
          "aot": true,
          "extractLicenses": true,
          "vendorChunk": false,
          "buildOptimizer": true,
          "serviceWorker": true
        }

Command for build : "build": "ng build --configuration=dev --aot",

Please help me. Thanks in advance !

Answer 1

Angular by default only configures the angular.json production environment to replace the environement.ts file. It uses this part of angular.json.

"configurations": {
   "production":{
      "fileReplacements":[
         {
            "replace":"src/environments/environment.ts",
            "with":"src/environments/environment.prod.ts"
         }
      ],
      "rest": ...
   }
}

Not for dev to use environment.dev.ts you would need to add the fileReplacements part to dev build too.

"fileReplacements":[
  {
    "replace":"src/environments/environment.ts",
    "with":"src/environments/environment.dev.ts"
  }
]

Or place your dev config to the non-post-fixed one.

Answer 2

you have to export the environment variable with the export keyword:

export const environment = {
  ...
}