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 !

What command do you use to compile the code? Also, did you think about upgrading to Angular 9 or 10? — Akxe
– Akxe, Commented May 5, 2020 at 13:08
the command : ng build --configuration=dev --aot. I can't for now to upgrade — GPiter
– GPiter, Commented May 5, 2020 at 13:09
At some point cli started to require to include all evnironment replacements candidates in tsconfig (or angular.json cannot remeber) in order to get it to work. It is not enough anymore to just have environment.xxx.ts in env directory. — Antoniossss
– Antoniossss, Commented May 5, 2020 at 13:10
@Antoniossss I can confirm this not being the case. Not for Angular 9 at least... — Akxe
– Akxe, Commented May 5, 2020 at 13:17

Philipp Meissner · Accepted Answer · 2020-05-06 06:59:42Z

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.

edited May 6, 2020 at 6:59

Philipp Meissner

5,4925 gold badges38 silver badges61 bronze badges

answered May 5, 2020 at 14:13

Akxe

11.8k6 gold badges43 silver badges80 bronze badges

Sign up to request clarification or add additional context in comments.

Comments

lionel · Accepted Answer · 2023-04-23 20:16:49Z

0

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

export const environment = {
  ...
}

answered Apr 23, 2023 at 20:16

lionel

1801 gold badge3 silver badges13 bronze badges

Collectives™ on Stack Overflow

Environment issue in Angular when try to build

2 Answers 2

Comments

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

2 Answers 2

Comments

Comments

Your Answer

Sign up or log in

Post as a guest

Related