Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Using invalid environment causes error in build (was "ERROR in Cannot read property 'length' of undefined") #5053

Closed
elvisbegovic opened this issue Feb 27, 2017 · 169 comments
Labels
P5 The team acknowledges the request but does not plan to address it, it remains open for discussion

Comments

@elvisbegovic
Copy link
Contributor

elvisbegovic commented Feb 27, 2017

(on existing project, on windows10) After updating :

  1. cli 31 to rc0
  2. angular packages to rc1
  3. typescript to 2.1.6

I get this insignifiant message error when running ng serve or ng build:

Cannot read property 'length' of undefined
TypeError: Cannot read property 'length' of undefined

What does this mean ?

@deebloo
Copy link
Contributor

deebloo commented Feb 27, 2017

@istiti can you fill out the issue template and give the steps to reproduce? What version of the cli are you updating from?

@elvisbegovic
Copy link
Contributor Author

@deebloo please apologize see point 1 again.
I have no additional info:


Cannot read property 'length' of undefined
TypeError: Cannot read property 'length' of undefined
    at createSourceFile (C:\Users\.....\node_modules\typescript\lib\typescript.js:14552:109)
    at parseSourceFileWorker (C:\Users\.....\node_modules\typescript\lib\typescript.js:14484:26)
    at Object.parseSourceFile (C:\Users\.....\node_modules\typescript\lib\typescript.js:14433:26)
    at Object.createSourceFile (C:\Users\.....\node_modules\typescript\lib\typescript.js:14288:29)
    at WebpackCompilerHost.getSourceFile (C:\Users\.....\node_modules\@ngtools\webpack\src\compiler_host.js:210:27)
    at findSourceFile (C:\Users\.....\node_modules\typescript\lib\typescript.js:63453:29)
    at processSourceFile (C:\Users\.....\node_modules\typescript\lib\typescript.js:63384:27)
    at C:\Users\.....\node_modules\typescript\lib\typescript.js:63494:17
    at Object.forEach (C:\Users\.....\node_modules\typescript\lib\typescript.js:1293:30)
    at processReferencedFiles (C:\Users\.....\node_modules\typescript\lib\typescript.js:63492:16)
    at findSourceFile (C:\Users\.....\node_modules\typescript\lib\typescript.js:63477:21)
    at processImportedModules (C:\Users\.....\node_modules\typescript\lib\typescript.js:63600:25)
    at findSourceFile (C:\Users\.....\node_modules\typescript\lib\typescript.js:63481:17)
    at processSourceFile (C:\Users\.....\node_modules\typescript\lib\typescript.js:63384:27)
    at processRootFile (C:\Users\.....\node_modules\typescript\lib\typescript.js:63271:13)
    at C:\Users\.....\node_modules\typescript\lib\typescript.js:62620:60
    at Object.forEach (C:\Users\.....\node_modules\typescript\lib\typescript.js:1293:30)
    at Object.createProgram (C:\Users\.....\node_modules\typescript\lib\typescript.js:62620:16)
    at AotPlugin._setupOptions (C:\Users\.....\node_modules\@ngtools\webpack\src\plugin.js:124:28)
    at new AotPlugin (C:\Users\.....\node_modules\@ngtools\webpack\src\plugin.js:23:14)
    at _createAotPlugin (C:\Users\.....\node_modules\@angular\cli\models\webpack-configs\typescript.js:55:12)
    at Object.exports.getNonAotConfig (C:\Users\.....\node_modules\@angular\cli\models\webpack-configs\typescript.js:70:19)
    at NgCliWebpackConfig.buildConfig (C:\Users\.....\node_modules\@angular\cli\models\webpack-config.js:27:37)
    at Class.run (C:\Users\.....\node_modules\@angular\cli\tasks\serve.js:37:98)
    at check_port_1.checkPort.then.port (C:\Users\.....\node_modules\@angular\cli\commands\serve.js:103:26)
    at process._tickCallback (internal/process/next_tick.js:103:7)

@dmytro-y-dev
Copy link

dmytro-y-dev commented Feb 27, 2017

@istiti Did you use ng new to create the project?

If so, make sure that you kept all original arrays in .angular-cli.json configuration like assets, styles and scripts. I received mistake as you do, because I removed assets option from .angular-cli.json.

@elvisbegovic
Copy link
Contributor Author

@metamaker no I don't use ng new I have assets styles and scripts as array.
I try on exisiting project running angular 2.4.8 ith cli31 to update to cli-rc0 and angular rc1 !

@dmytro-y-dev
Copy link

Provide your .angular-cli.json, please.

@elvisbegovic
Copy link
Contributor Author

elvisbegovic commented Feb 27, 2017

https://gist.github.com/istiti/e544744f16480829416e62b32167051e

ps: when running ng new test --ng4 it works... but I want get working again my existing project

@dmytro-y-dev
Copy link

dmytro-y-dev commented Feb 27, 2017

Your .angular-cli.json looks ok, not sure what is wrong. Maybe someone else will be able to help you ;) .

@elvisbegovic
Copy link
Contributor Author

elvisbegovic commented Feb 27, 2017

additional info :
I tried in green project "ng new mynewproject --ng4" it work well, it run!

then move all my old /app folder to this new one and I get same error !

apparently the issue is in my code/module ... My project is relativly big I can't remove module by module :(

how achieve this ? can I get more signifiant message error

thanks

@hansl
Copy link
Contributor

hansl commented Feb 27, 2017

This is a real issue and we will look at it.

@elvisbegovic
Copy link
Contributor Author

elvisbegovic commented Feb 27, 2017

Additionals infos:
Yes of course I always use Renderer and template in my project.. but need more signifiant message error to achieve this properlly.

Thanks, actually can't move...

Cc @hansl

@hansl
Copy link
Contributor

hansl commented Feb 28, 2017

@isiti can you provide a repository or some sort of code sample that we could use to reproduce? Maybe your package.json might be enough, if you're okay to share that.

@elvisbegovic
Copy link
Contributor Author

Will do it tomorrow at 7AM (UTC +1)

Thanks coz can't move (actually blocked)

@hansl

@trentmswanson
Copy link

I was experiencing the same issue here and after I rolled typescript back from 2.2.1 to 2.0.10 that seemed to fix it.

@elvisbegovic
Copy link
Contributor Author

elvisbegovic commented Mar 1, 2017

@hansl here you are https://gist.github.com/istiti/f97eb83c6d18fd1d23965e4a3325033e

@trentmswanson FYI after passing from 2.1.6 to 2.0.10 I get this error

then when I update typescript from 2.0.10 to 2.2.1 I get same error as in 2.1.6

@rdesimone
Copy link

rdesimone commented Mar 1, 2017

The strange thing here: the project with angular-cli rc.0 was working fine till executing the first ng build --target=production (maybe just a coincidence). Since then the project is broken. ng serve gives the same error now.

When I setup a new project, it is possible to build.

I removed and reinstalled angular-cli like documented (including node_modules) - the same. Also downgraded Typescript to 2.0.0 like the default for a blank project and took all possible settings of a blank project.

@filipesilva filipesilva changed the title undefined ERROR in Cannot read property 'length' of undefined Mar 1, 2017
@rdesimone
Copy link

Checking out from the repository into a new directory and running npm install fixed the issue - the files are the same. The project in the original directory became suddenly unusable - was not able to find out the reason.

@elvisbegovic
Copy link
Contributor Author

As said : I putt in new green cli --ng4 project whole my /app folder and same issue

@moniuch
Copy link

moniuch commented Mar 1, 2017

Apart from the lack of a descriptive message (which is the main focus for this issue), should anyone run into this case, don't panic - chances are that it's just a temporary glitch. I ran into this situation twice and it looked like a local problem with syncing files. The second incident of mine was a bit more clear to me - it followed a git pull. Waiting ca 1 minute and rebooting ng serve cured the app and restored its running state.

FWIW: Since this is ng serve reboot that helps, I would recommend to look closer at the angular-cli.json file - perhaps into the apps.assets item which has been made a mandatory array if I am correct (meaning it does not accept a single string anymore).

@elvisbegovic
Copy link
Contributor Author

additional info: same behavior with angular rc2

@elvisbegovic
Copy link
Contributor Author

additional info

with this conf. my project works/compile fine with typescript 2.1.6 here's my working package.json:

@angular/cli: 1.0.0-rc.0
node: 6.9.2
os: win32 x64
@angular/common: 2.4.9
@angular/compiler: 2.4.9
@angular/core: 2.4.9
@angular/forms: 2.4.9
@angular/http: 2.4.9
@angular/platform-browser: 2.4.9
@angular/platform-browser-dynamic: 2.4.9
@angular/router: 3.4.9
@angular/cli: 1.0.0-rc.0
@angular/compiler-cli: 2.4.9

BUT it breaks

when I add these lines to my package.json, I get length undefined:

"@angular/common": ">=4.0.0-beta <5.0.0",
"@angular/compiler": ">=4.0.0-beta <5.0.0",
"@angular/core": ">=4.0.0-beta <5.0.0",
"@angular/forms": ">=4.0.0-beta <5.0.0",
"@angular/http": ">=4.0.0-beta <5.0.0",
"@angular/platform-browser": ">=4.0.0-beta <5.0.0",
"@angular/platform-browser-dynamic": ">=4.0.0-beta <5.0.0",
"@angular/router": ">=4.0.0-beta <5.0.0"

@cgebe
Copy link

cgebe commented Mar 2, 2017

same issue for me.

I get this error only when building/serving with --prod flag:

    "@angular/cli": "1.0.0-rc.0",
    "@angular/common": "^2.4.8",
    "@angular/compiler": "^2.4.8",
    "@angular/compiler-cli": "^2.4.8",
    "@angular/core": "^2.4.8",
    "@angular/forms": "^2.4.8",
    "@angular/http": "^2.4.8",
    "@angular/platform-browser": "^2.4.8",
    "@angular/platform-browser-dynamic": "^2.4.8",
    "@angular/router": "^3.4.8",
Cannot read property 'length' of undefined
TypeError: Cannot read property 'length' of undefined
    at createSourceFile (/home/...../node_modules/typescript/lib/typescript.js:14546:109)
    at parseSourceFileWorker (/home/...../node_modules/typescript/lib/typescript.js:14478:26)
    at Object.parseSourceFile (/home/...../node_modules/typescript/lib/typescript.js:14427:26)
    at Object.createSourceFile (/home/...../node_modules/typescript/lib/typescript.js:14282:29)
    at VirtualFileStats.getSourceFile (/home/...../node_modules/@ngtools/webpack/src/compiler_host.js:66:35)
    at WebpackCompilerHost.getSourceFile (/home/.....node_modules/@ngtools/webpack/src/compiler_host.js:213:38)
    at findSourceFile (/home/...../node_modules/typescript/lib/typescript.js:63447:29)
    at processImportedModules (/home/...../node_modules/typescript/lib/typescript.js:63594:25)
    at findSourceFile (/home/...../node_modules/typescript/lib/typescript.js:63475:17)
    at processSourceFile (/home/.....node_modules/typescript/lib/typescript.js:63378:27)
    at processRootFile (/home/...../node_modules/typescript/lib/typescript.js:63265:13)
    at /home/...../node_modules/typescript/lib/typescript.js:62614:60
    at Object.forEach (/home/...../node_modules/typescript/lib/typescript.js:1293:30)
    at Object.createProgram (/home/...../node_modules/typescript/lib/typescript.js:62614:16)
    at AotPlugin._setupOptions (/home/...../node_modules/@ngtools/webpack/src/plugin.js:124:28)
    at new AotPlugin (/home/...../node_modules/@ngtools/webpack/src/plugin.js:23:14)
    at _createAotPlugin (/home/...../node_modules/@angular/cli/models/webpack-configs/typescript.js:55:12)
    at Object.exports.getAotConfig (/home/...../node_modules/@angular/cli/models/webpack-configs/typescript.js:89:19)
    at NgCliWebpackConfig.buildConfig (/home/...../node_modules/@angular/cli/models/webpack-config.js:26:37)
    at Class.run (/home/...../node_modules/@angular/cli/tasks/build.js:27:92)
    at Class.run (/home/...../node_modules/@angular/cli/commands/build.js:143:26)
    at Class.<anonymous> (/home/...../node_modules/@angular/cli/ember-cli/lib/models/command.js:134:17)
    at process._tickCallback (internal/process/next_tick.js:103:7)

@henritoivar
Copy link

I have the same issue on ubuntu 14.04 with node 7.6.0, npm 4.1.2 when running: ng build. works on my windows machine. here is my package.json.

"dependencies": {
    "@angular/common": "^2.4.8",
    "@angular/compiler": "^2.4.8",
    "@angular/core": "^2.4.8",
    "@angular/forms": "^2.4.8",
    "@angular/http": "^2.4.8",
    "@angular/platform-browser": "^2.4.8",
    "@angular/platform-browser-dynamic": "^2.4.8",
    "@angular/router": "^3.4.8",
    "@ngx-translate/core": "^6.0.0",
    "@ngx-translate/http-loader": "0.0.3",
    "bootstrap-sass": "^3.3.6",
    "core-js": "^2.4.1",
    "intl": "^1.2.4",
    "jquery-ui": "^1.12.0",
    "moment": "^2.13.0",
    "ng2-bootstrap": "^1.1.2",
    "ng2-file-upload": "^1.1.0",
    "ng2-toastr": "^1.5.1",
    "ng2-ui-auth": "^6.1.3",
    "node-sass": "^3.7.0",
    "primeng": "^2.0.1",
    "primeui": "^4.1.15",
    "rxjs": "^5.1.0",
    "zone.js": "^0.7.6"
  },
  "devDependencies": {
    "@angular/cli": "^1.0.0-rc.0",
    "@angular/compiler-cli": "^2.4.0",
    "@types/jasmine": "2.5.38",
    "@types/node": "~6.0.60",
    "codelyzer": "~2.0.0",
    "jasmine-core": "~2.5.2",
    "jasmine-spec-reporter": "~3.2.0",
    "karma": "~1.4.1",
    "karma-chrome-launcher": "~2.0.0",
    "karma-cli": "~1.0.1",
    "karma-coverage-istanbul-reporter": "^0.2.0",
    "karma-jasmine": "~1.1.0",
    "karma-jasmine-html-reporter": "^0.2.2",
    "protractor": "~5.1.0",
    "ts-node": "~2.0.0",
    "tslint": "~4.4.2",
    "typescript": "~2.0.0"
  }

@moosetraveller
Copy link

moosetraveller commented Mar 3, 2017

Probably not the same cause but we had the same error (Cannot read property 'length' of undefined) when we accidentally deleted environment.prod.ts during a refactoring process. Restoring this file solved our problem.

@henritoivar
Copy link

@moosetraveller Thanks a lot. This actually happened to be the issue. On our staging server we had no environment file set up.

@elvisbegovic
Copy link
Contributor Author

nop, it's not same cause... I have this file under src/environments/environments.prod.ts

cc @moosetraveller

@cgebe
Copy link

cgebe commented Mar 3, 2017

Issue was resolved by adding an environment.prod.ts file as stated by @moosetraveller. Thanks!
Though, an error message more appropriate to the cause would be much appreciated.

@rvraaphorst
Copy link

Had the same issue, turned out that in node_modules/typescript/lib/typescript.js (line 12619) the sourceText variable was undefined somehow (function code below) . It pointed to the src/environments/environment.ts file (that existed) while the .angular-cli.json dev environment pointed to environments/environment.dev.ts (that existed too). (ng serve --env=dev was executed)
Setting the .angular-cli.json dev environment to environments/environment.ts solved the problem for now.

package.json:

...
"devDependencies": {
		"@angular/cli": "~1.7.2",
		"@angular/compiler-cli": "^5.2.0",
		"@angular/language-service": "^5.2.0",
		"@types/jasmine": "~2.8.3",
		"@types/jasminewd2": "~2.0.2",
		"jasmine-core": "~2.8.0",
		"jasmine-spec-reporter": "~4.2.1",
		"karma": "~2.0.0",
		"karma-chrome-launcher": "~2.2.0",
		"karma-coverage-istanbul-reporter": "^1.2.1",
		"karma-jasmine": "~1.1.0",
		"karma-jasmine-html-reporter": "^0.2.2",
		"protractor": "~5.1.2",
		"typescript": "~2.5.3"
	}
function createSourceFile(fileName, languageVersion, scriptKind) {
            // code from createNode is inlined here so createNode won't have to deal with special case of creating source files
            // this is quite rare comparing to other nodes and createNode should be as fast as possible
            var sourceFile = new SourceFileConstructor(265 /* SourceFile */, /*pos*/ 0, /* end */ sourceText.length); 
            nodeCount++;
            sourceFile.text = sourceText;
            sourceFile.bindDiagnostics = [];`
            ...
}  

@PaloMiklo
Copy link

PaloMiklo commented Mar 27, 2018

I ran into this error, finally, I found out it was because a typo (exclamation mark inside the string interpolation). I wrote:

'Server with ID {{ serverId }} is {{ serverStatus! }}'

instead of

'Server with ID {{ serverId }} is {{ serverStatus }}!'

@abdel-ships-it
Copy link

abdel-ships-it commented Mar 29, 2018

Simply delete a component folder and the angular-cli will detect the change and try to recompile. The code seems to link to a createSourceFile function in typescript.js

var sourceFile = new SourceFileConstructor(265 /* SourceFile */, /*pos*/ 0, /* end */ sourceText.length);

I assume typescript is getting passed a file that doesn't exist anymore and fails to create it?

Edit: seems that this problem occurs whenever a non existing file attempts to get compiled by typescript.

@ankitsindhu
Copy link

There might be an issue with environment.ts file.
check if it is really-
export const environment = {
production: false,

dialogflow: {
angularBot: 'YOUR_CLIENT_TOKEN'
}
};

@ankitsindhu
Copy link

I did this change and it worked for me.

@jakubatig
Copy link

@filipesilva Can confirm what @nikdo said, and we fixed by downgrading cli to 1.6.1. I can get some time early next week to debug a little or see if our package.json yields a repro. Mention me if that would help.

@filipesilva
Copy link
Contributor

angular/devkit#667 should fix this in 6.0 by failing early when the specified environment file (it will be called fileReplacements in v6) does not exist.

@filipesilva filipesilva removed the needs: repro steps We cannot reproduce the issue with the information given label Apr 12, 2018
@filipesilva filipesilva added this to the v6.0.0 milestone Apr 12, 2018
@hansl hansl changed the title ERROR in Cannot read property 'length' of undefined Using invalid environment causes error in build (was "ERROR in Cannot read property 'length' of undefined") Apr 12, 2018
@hansl hansl added the P5 The team acknowledges the request but does not plan to address it, it remains open for discussion label Apr 12, 2018
@hansl
Copy link
Contributor

hansl commented Apr 12, 2018

Marking this nice to have because there seems to be a fix already.

@hansl hansl removed this from the v6.0.0 milestone Apr 12, 2018
@khanali21
Copy link

I created this patch for version 1.7.3 , you can apply the patch to node_modules/@ngtools/webpack/src/plugin.js and you should be good to go.

493c492,494
<             this._discoveredLazyRoutes = this._getLazyRoutesFromNgtools();
---
>             this._discoveredLazyRoutes = this.firstRun
>                 ? this._getLazyRoutesFromNgtools()
>                 : this._findLazyRoutesInAst();

@Blazzze
Copy link

Blazzze commented Apr 17, 2018

To me removing comments from the environments files worked 👍 🔢

@VitalyName
Copy link

I solved this problem (error during refactoring test). All is good for angular v4.3.* and v4.4*

  1. Change @angular/cli" version 1.7.3 to 1.4.10 in package.json (latest for angular4)
  2. rm -rf node_modules
  3. npm install --no-optional

@Tomek6789
Copy link

Tomek6789 commented May 5, 2018

I have the exact same problem as @FunnyGhost (angular-cli 1.7.0, angular 2.4.10 typescript 2.2.2). Downgrading the angular-cli to 1.6.1 resolved my problem, but version 1.6.1 required angular-devkit/core in devDependencties

@atariman5000
Copy link

I too like others found the problem to be with the "plugin.js" file within "node_modules@ngtools\webpack\src\plugin.js". The problem is with the "_findLazyRoutesInAst()" function. This function is called on the second pass when running your unit test (w/ Karma). This function only looks at files that have been modified, and there is a file path in the array "this._compilerHost.getChangedFilePaths()" that ends with "/src", and all of the other paths end with .ts files. To resolve this problem, I check the file path to see if it ends with ".ts", and if so, I push that path into an array. Below is my solution to this problem. I would like to submit this as a bug fix, but I do not know where to do so.

------- plugin.js : ln 211 -------

_findLazyRoutesInAst() {
benchmark_1.time('AotPlugin._findLazyRoutesInAst');
const result = Object.create(null);
var changedFilePaths = [];
this._compilerHost.getChangedFilePaths().forEach(f => {
if(f.endsWith(".ts")) {
changedFilePaths.push(f);
}
});
for (const filePath of changedFilePaths) {
const fileLazyRoutes = lazy_routes_1.findLazyRoutes(filePath, this._compilerHost, this._program);

@pierremalaga
Copy link

I have modified this file and it works fine, but it will never be fixed in any new version?
This is my solution, it's similar to @ atariman5000 but inside an for:

_findLazyRoutesInAst() {
  benchmark_1.time('AotPlugin._findLazyRoutesInAst');`
  const result = Object.create(null);`
  const changedFilePaths = this._compilerHost.getChangedFilePaths();`

  for (const filePath of changedFilePaths) {
 >> if(filePath.match(/.*\/*\.[A-Za-z]*$/)) {
      const fileLazyRoutes = lazy_routes_1.findLazyRoutes(filePath, this._compilerHost, this._program);
      for (const routeKey of Object.keys(fileLazyRoutes)) {
        const route = fileLazyRoutes[routeKey];
        if (routeKey in this._lazyRoutes) {
          if (route === null) {
             this._lazyRoutes[routeKey] = null;
          }
          else if (this._lazyRoutes[routeKey] !== route) {
             this._compilation.warnings.push(new Error(`Duplicated path in loadChildren detected during a rebuild. `
                    + `We will take the latest version detected and override it to save rebuild time. `
                    + `You should perform a full build to validate that your routes don't overlap.`));
           }
         }
         else {
            result[routeKey] = route;
         }
      }
    }
  }
  benchmark_1.timeEnd('AotPlugin._findLazyRoutesInAst');
  return result;
} 

@finalsnd
Copy link

finalsnd commented May 26, 2018

I had a similar message recently when I added some new environments files in the angular-cli.json

        "prod": "environments/environment.prod.ts",
        "xamp": "environments/environment.xamp..ts"

The problem was I misstyped the name of one of the files: environment.xamp**.**.ts (I typed twice the dot)

I was very hard to figure what was wrong with my project (I knew only it had to be something with the environments files). A nice error sugesting about how i misspelled the files would have been perfect :/

@mariohmol
Copy link

This error should be improved.. for instance.. in most of the cases is the environment.xxx.ts missing.. so a message where file could not be found would be nice!

@dhruvaldarji
Copy link

My team has been struggling with this for months, but @mhamel06's comment resolved the issue for me. It would be nice to have an actual fix that doesn't require modification of a lib file though.

hansl pushed a commit that referenced this issue Jun 6, 2018
@mittinatten
Copy link

The variant of the problem described by @FunnyGhost in #5053 (comment) is gone in 6.0.7.

@aikeda
Copy link

aikeda commented Nov 22, 2018

The above comment about the environment file caught my attention. I was with the same problem and looking at my .angular-cli.json I could fix and reproduce the error when one of those files below were missing:

"environments": {
    "dev": "environments/environment.ts",
    "prod": "environments/environment.prod.ts",
    "qa": "environments/environment.qa.ts"
}

So, those files must exist otherwise this error will happen. The cli could raise a more meaningful error message.

@angular-automatic-lock-bot
Copy link

This issue has been automatically locked due to inactivity.
Please file a new issue if you are encountering a similar or related problem.

Read more about our automatic conversation locking policy.

This action has been performed automatically by a bot.

@angular-automatic-lock-bot angular-automatic-lock-bot bot locked and limited conversation to collaborators Sep 8, 2019
Sign up for free to subscribe to this conversation on GitHub. Already have an account? Sign in.
Labels
P5 The team acknowledges the request but does not plan to address it, it remains open for discussion
Projects
None yet
Development

No branches or pull requests